STERFIELD

2015/09/16

javascriptで「window.matchMedia」があるというのを今更知った件

javascriptで「window.matchMedia」があるというのを今更知った件

レスポンシブのサイトをコーディングする際、javascriptでSPの時だけ動かしたいことや、SPの時にjavascriptを使って制御しなきゃいけない時に、今までは以下の用に書いていました。
(jQuery使用)

ブラウザの幅を取得してそのサイズによって処理を変えるというやり方です。

しかし、つい最近window.matchMediaという存在を知りました。
これは、いわゆるcssのmediaqueryのjavascript版というもので、
以下の用に書きます。

ただ、chrome,firefoxは問題ないのですが、IE10以上からでないと効かないそうです。

IE9以下でも使いたい場合は、
paulirish/matchMedia.js · GitHub
こちらのプラグインを使うと使用可能になるそうです。

とはいえ、レスポンシブなのでIE9で動かないとしても問題ないかと思います!
さすがにie9を縮小して見る人はいないでしょうから・・・(いるのかな??)

Author Profile

著者近影

スターフィールド編集部

SHARE

合わせて読みたい