なんて素敵なスクリプト!さすがGoogle先生!!!
最近はレスポンシブWEBデザインのサイトも増えてきましたので、ブラウザの幅やデバイスによってサイトの見せ方を変える必要もあるんです。
例えば、一見普通のPCサイトと思いきや、ブラウザの幅を縮めてみるとスマフォでもちゃんと収まって見えるように最適化されてある!!!みたいな。
これを実現する方法としてCSS3のMedia Queriesを利用する訳ですが、ここでもやっぱりIEがすんなり話を通してくれません><;
ですので、IEでもMediaQueriesを利用するために、Google Codeで公開されているcss3-mediaqueries.jsを利用します。
css3-mediaqueries.js のダウンロード
Googleコードで公開されているcss3-mediaqueries.jsをダウンロードします。css3-mediaqueries.js
css3-mediaqueries.js の設置
あとは、<head>内にこんな感じで設置します。
1 2 3 |
<!--[if lt IE 9]> <script type="text/javascript" src="css3-mediaqueries.js"></script> <![endif]--> |
CSSファイルにMedia Queriesの記述をします。
コメント