札幌Web制作のシンクグラフィカ

ResponsiveTab.jsを公開

Web用フリー素材Javascriptに『ResponsiveTab.js』を追加しました。簡単にレスポンシブWebデザインに対応したタブメニューを追加するためのスクリプトです。

2013-11-22

見た目や挙動に関する設定をすべてHTMLとCSS側にふることでレスポンシブWebデザインに最適化したタブメニュー用のスクリプトになります。CSS3のTransitionを利用することでアニメーションを付けることもできる優れもの。

その他、title属性を読み取って自動的にタブ化するなどの機能も含まれており、美しいHTMLソースのままタブメニューを実現できます。描画領域の少ないスマートフォンなどのモバイルデバイスでタブメニューは割りと重要ですので、きっと重宝するはず。

本スクリプトはjqueryなどは使っていませんが、実装しやすいように工夫したつもりなので、ぜひ一度お試しください。

ResponsiveTab.js