任意のエレメントに、サイズに応じてclassの追加/削除をするスクリプト・Responsive elements

スポンサーリンク

任意のエレメントに、画面サイズに合わせて特定のclassの追加/削除を行うスクリプト・Responsive elementsのご紹介です。特定の画面サイズになるとclassが付与されるので、そのclassを使ってCSSを書きます。

前も似たようなものがあった気がしますけど・・こちらも軽量で良さそうです。classを与える事で、RWDの対応もしやすくなりそうです。尚、スクリプトはjQuery依存です。

Responsive elements


特定のサイズで指定した要素にclassを追加してくれます。シンプルで良さそうですね。

セッティングは要素ごとにカスタムデータ属性を利用します。

<div class="foo" data-respond="start: 100px; end: 900px; interval: 50px;">

これで、画面サイズにあわせてclassが付与されます。

詳細は以下よりどうぞ。

Responsive elements

URL :
TRB :

Comments & Trackbacks

Comments are closed.

Twitter

Web制作に役立つそうなリソースを独断と好みで配信しています。

かちびと.netにリンクの無いトラックバックはお受けいていません。
コメントされる前にガイドラインをご覧下さい。

twitter facebook rss contact

Ads

Posts

Contact

Services