2011/03/02

IE6でも CSS3のセレクターを利用できる「Selectivizr」

最近では、IE6への対応は殆ど求められなくなってきていますが、IE7やIE8は今でもウェブサイトの制作では対象になることが多いです。その際に、IE7、IE8へCSS3のセレクターを利用できるようにする 「Selectivizr」というライブラリがあります。このjsライブラリは、海外の有名なデザイナーが最近ではこぞって利用しています。






利用される理由は、このjsライブラリの実装が簡単なこと、パフォーマンスに非常に気を使っていることが理由です。

「Selectivizr」実装方法

「Selectivizr」は、jQuery、dojo、など下記の表にあげたjsのライブラリと一緒に利用すればそのまま自動的にCSS3が動くようになります。




あとは下記のコードを head要素内に埋め込むだけです。

<script type="text/javascript" src="[JS library]"></script>
<!--[if (gte IE 6)&(lte IE 8)]>
  <script type="text/javascript" src="selectivizr.js"></script>
  <noscript><link rel="stylesheet" href="[fallback css]" /></noscript>
<![endif]-->


利用できるCSS3セレクターは違いがあり
一緒に実装するライブラリによって利用出来る CSS3のセレクターには違いがありますので
上記の表をみて確認しながら作業をしましょう。

備考:
「Selectivizr」はjQueryの1.5にも対応していますので安心して利用することができます。


Bookmark and Share