前の記事 ≪:2011年8月29日 管理人のブックマーク
次の記事 ≫:CSS3を使ったクリエイティブなテキストエフェクト集23

ブラウザサイズに応じてclass名を自動で付け替えてくれるjQueryプラグイン「browserSizr」

2011年08月30日-はてなブックマーク

スポンサード リンク
[PR] 英単語を忘却曲線アプリを使って超効率よく記憶する方法
jQuery browserSizr | jQuery Plugins

ブラウザサイズに応じてclass名を自動で付け替えてくれるjQueryプラグイン「browserSizr」。
スマートフォンや色々な解像度のPCがあるご時世ですが、ブラウザのサイズに応じてコンテナのclass名を付け替えてくれるjQueryプラグインのご紹介です。
クラス名が変わることによってデザインをCSSで自由に切り替えることが可能です。
スマートフォンにも対応しているようです。自分で作っちゃっても全く問題なさそうな機能ではありますが、スクリプティングがめんどくさいという方はこれを使っちゃったり参考にしてもよさそう。



1024ピクセル以上の場合(Chromeのデベロッパーツールでみています)



1024ピクセル以下にブラウザを縮小すると次のようにクラスが付与され、デザインも調整されます。



あとは好きにCSSでデザインしちゃうだけです。

関連エントリ
関連の記事検索:jQuery, スマートフォン, プラグイン, CSS, JavaScript, jQueryプラグイン
スポンサード リンク

By.KJ : 2011年08月30日 09:05 livedoor Readerで購読 Twitterに投稿

間違いの指摘をしていただける方はメール、あるいはTwitter/FBでお願いします(クリック)