タグ

2011年6月23日のブックマーク (4件)

  • もっとシンプルかつ簡単にフォントサイズを変える「大・中・小」ボタンを実装する方法

    フォントサイズを変える「大・中・小」ボタンを画像も使って実装する方法 先にエントリーした内容の別版。前のはボタン部分をimgの画像として読みこんで、そのsrcを変えることで実現をしていたのですが、なんだか有用性が低かったきがしてならなかったので、もう少しシンプルに且つ画像でもCSSのボタンでもどちらでもOKなようなスクリプトに変えてみた。 今回の仕様 先に紹介しているものは、画像リンクを変えて実装していたのに対し、今回はボタンを背景画像を利用して実装。同時に:hove時とクリックした部分につけるactiveに対して、CSSを予め用意しておく。 ちなみに、今回はCSS Spriteにて実装。 利用したソース・CSS・画像 JavaScriptのソースは最初に作ったものに、activeのclassをつけたり削除する機能をつけただけ。 ■JavaScript jQuery(function($)

    もっとシンプルかつ簡単にフォントサイズを変える「大・中・小」ボタンを実装する方法
  • フォーム機能の拡張-HTML5リファレンス

    ■フォーム機能の拡張 HTML5では、フォームに関する新しい属性や指定できる属性値が多数追加される予定です。 入力必須・妥当性チェック・入力補助など、 これまでJavaScriptで作成されることの多かった機能が、 HTMLタグの属性だけで実現できるようになりそうです。 いずれも使用頻度の高い機能だけに、各ブラウザのサポートが待ち遠しいところです。 ■<input>タグのtype属性に追加される値 HTML5では、<input>タグのtype属性に指定できる値の種類が増えています。 それぞれの値を指定した場合、例えば、<input type="email">を指定すると、 この属性値をサポートしているFirefox4・Opera10・Google Chromeなどのブラウザでは、 送信ボタンを押したときに入力されている値がメールアドレスとして妥当かどうかチェックしてくれます。 また、Ope

  • PhotoShopにカラーホイールを追加するプラグイン: CGとかの覚え書きブログ

    CS5の体験版を色々弄くり中です。 このバージョンからカラーホイールが搭載されたとの事で期待していたのですが右クリックを押しっぱなしにしていないと維持されないという「どうしてこうなった\(^o^)/」的なお馬鹿仕様の為早々に利用をあきらめました。以下PSCS5Extended64bit体験版(PCはWin7 64bit版)での右往左往の様子。 ・CS5に新規搭載されたカラーホイール Shift+Alt+右クリック押しっぱなし 大きさとホイールかカラーセレクタ(色のボックスクリックで呼び出すダイアログ)の選択は環境設定から選べます。 他の方がどうか知りませんが自分は色塗りの際ににSAIのカラーホイール上で色を選ぶ時にまず塗りたい箇所の下塗り(すでにベースカラーを塗ってある)をスポイトで色を拾って色相のホイールを動かし、四角の中で色味を調整して塗るという流れでやっています。 今回搭載されたホ

  • border-image を利用したボックスデザイン

    border-image を利用したボックスデザイン border-image プロパティは装飾の幅を広げてくれそう。使うにあたっていろいろ調べたので、サンプルなどを用意して整理しておくことにした。 まずは現在の草案(2009年10月15日版)を読んで、関連プロパティや、設定できる値など、仕様の概要を簡単に整理したものを箇条書きにしてみる。 要素の border-style?プロパティと background-image プロパティの代りに使う画像を設定する。画像は四辺それぞれには必要なくて、ひとつだけ用意すればよい (border-image-source) 画像の四辺それぞれから内側にスライスする位置を設定、画像は四つの辺、四つの角、中央の9つに分ける。中央は背景画像のように使われる (border-image-slice) 四つの辺の高さを設定する (border-image-wid

    border-image を利用したボックスデザイン