2005/08/05
ページ内の項目を自動認識してタブにする。 そして、各項目を呼び出すメニューも自動生成して任意の場所に表示する。 MSIE6で完璧に動作。Firefoxはスクロールバーのスクロール方法が多少違う。OperaはDOMにバグが多いので小さなバグがある。 全体的にややこしいので配布には向かない。技術的興味。多分作成者の私じゃないと導入できないかも→導入例(ほぼ実験台)
HN:Reload
WebSite:http://www.usamimi.info/~geko/
<div class="tab_group">の直下にあるDIVのグループを全て自動的にタブ化し、さらにDIVにつけられたtitle属性を取得してメニューも自動生成します。
このスクリプトの動作に必要な初期要素は基本的にタブの元となる項目だけで、メニュー表示部分とスクリプト本体を仕込むだけでタブ化されます。
var set_tab_color1 = "#eeeeee"; //選択時のタブメニューの背景色
var set_tab_color2 ="#cccccc"; //タブメニューの背景色
var set_tab_type = true //タブメニューの種類 true...横長 false...縦長
var Tab_space_height = "300px" //表示させるタブの高さを指定。CSSの文法です。
var Tab_space_width = "80%" //表示させるタブの幅を指定。CSSの文法です。
var scroll_no = true; //スクロールバーをつけるか付けないか、つけるtrue
つけないfalseset_tab_color1は、現在表示されているタブのタブメニューの背景色を指定します。set_tab_color2は、表示されていないほかのタブ全てに対応するタブメニューの背景色を指定します。set_tab_typeは、タブメニューが横長か縦長かを指定します。基本的にタブメニューバーの位置は好きにできるので、縦長のメニューを置きたい場合この値をfalseにします。Tab_space_heightは、スクロールバーを表示させた場合のタブの高さをCSSの文法で指定します。Tab_space_widthは、スクロールバーを表示させた場合のタブの幅をCSSの文法で指定します。scroll_noは、スクロールバーの有無を設定。なしだとタブの下の文章がタブのサイズによって上下することがあります。