jQueryを使ってCSSを補強するテクニック15

jQuery | 09.10.22 19:41

Web Developer Plusで、jQueryを使ってCSSを補強するテクニックが紹介されています。

ざっといくつかご紹介。

jQueryでカラムの高さを統一する
equalHeights pluginを使って、一行でカラムの高さを同じにする
入力中のフォームをハイライトする
highlighting the label along with the selected input fieldを使って、フォームのユーザビリティーを上げるテクニック
角丸
jQuery Curvy Cornersで角丸を実装する
メニューの背景をアニメーションさせる
メニューにマウスオーバーしたときに、一瞬でhover画像に切り替えるのではなく、ふわ〜っとアニメーションして切り替えるテクニック。例：Create an Attractive jQuery Menu with Fade In and Fade Out Effect or Animated Menu Using jQuery
ボーダーに画像を使う
CSS3はborderに色だけでなく画像を使用できるが、ブラウザによっては対応していない。jQuery.borderimageを使ってborder-imageプロパティーをクロスブラウザに適用するテクニック
疑似クラスをIEにも適用させる
CSS 2.1は「:focus」や「:first-child」といった疑似クラスをサポートしているが、IEでは利用できない。Super CSS Selectorを使ってIEにも疑似クラスを適用させるテクニック