タブ切り替えJavascript
いまさら感丸出しですがレスポンシブWeb用でちょっと作る機会があったので公開します。よくあるタブ切り替え用Javascriptです。jqueryは使っていません。
タブ切り替えJavascriptの概要
基本的には美しいHTML構造をそのままに、ちょっぴりインタラクティブなタブ風味付けを付加しちゃうぞ!的な位置づけなので、その他多くのタブ切り替えと比べるととても貧弱かもしれません。レスポンシブWebを想定して、スマートフォンからの場合はタブ機能を無効にし、一般的なページ内アンカーとして振る舞うという設定をすることができます。もちろんスマートフォンサイズのタブであればスマートフォンで動作するようにもできます。
タブ切り替えJavascriptの機能
- すごく簡単に設置できる
- たぶん簡単です。あんまり複雑では無いはず。
- レスポンシブWebに対応
- この手のJavascriptはレスポンシブWebるときに結構邪魔臭かったりします挙動が。なのでスマホの場合無効にする!みたいな設定を付けることができます。
- 見た目はCSSで好きにして
- 見た目をいぢるのはちょっとめんどくさいかもしれませんがCSSで好き勝手にやってください。
デモサイト
タブ切り替えJavascriptの更新履歴
更新日 | バージョン | 更新内容 |
---|---|---|
2012-10-08 | 1.0.1 | バージョン1.0.1を公開 |