« ActionScript3 事始め | メイン | bluewindでファイルランチャー »
prototype.js でタブ切り替え(複数表示版)
prototype.js でタブ切り替え - AUSGANG SOFT
http://a-h.parfe.jp/einfach/archives/2006/1012175043.html
に、同じページで複数タブを表示できるようにならないか？
というご要望をいただきました。l
もともと１つしかタブがない想定なので、大幅な改造が必要。
いい機会なので、作ってみました。
サンプル
http://a-h.parfe.jp/einfach/archives/tabSample.html
CSSもJavascriptも↑のファイル内に書いています。
変更点
↑という指定で、複数のタブを作っています。
サンプルを参考にHTML、CSSもそれぞれの名前で指定してください。
逆にいうと、デザインを別々にすることができます。
http://a-h.parfe.jp/einfach/archives/2006/1012175043.html
に、同じページで複数タブを表示できるようにならないか？
というご要望をいただきました。l
もともと１つしかタブがない想定なので、大幅な改造が必要。
いい機会なので、作ってみました。
サンプル
http://a-h.parfe.jp/einfach/archives/tabSample.html
CSSもJavascriptも↑のファイル内に書いています。
変更点
- 複数タブに対応
new TabMaker('tab');
new TabMaker('menu');
↑という指定で、複数のタブを作っています。
サンプルを参考にHTML、CSSもそれぞれの名前で指定してください。
逆にいうと、デザインを別々にすることができます。
- document.getElementsByClassName の使用をやめました。
ページによっては非常に重いという指摘をいただいていたので、必要ないようにしてみました。
- ページの読み込みを待たずに、タブ表示を行うようにした。
タブのHTMLの直後にタブ表示をする処理をいれることで、読み込むを待つ必要をなくしています。
トラックバック(0)
このブログ記事を参照しているブログ一覧: prototype.js でタブ切り替え(複数表示版)
このブログ記事に対するトラックバックURL: http://a-h.parfe.jp/mt4/cgi-bin/mt-tb.cgi/193
コメントする