クリックタブ切り替えとDIVタブの自動切り替え_JavaScriptのヒント-jsチュートリアル-php.cn

复制代 代码如下: 点击切换と自動切换選択项卡 *{リストスタイル:なし;マージン:0;パディング:0;オーバーフロー:非表示} .tab1{幅:401px;border-top:#A8C29F ソリッド 1px;border-bottom:#A8C29F ソリッド 1px;margin:50px 200px;} .menu{幅:400px;背景:#eee;高さ:28px;border-right:#A8C29F 実線 1px;border-bottom:#A8C29F 実線 1px;} li{float:left;width:99px;text-align:center;line-height:28px;height:28px;cursor:pointer;border-left:#A8C29F Solid 1px;color:#666;font-size:14px;オーバーフロー:非表示} .menudiv{幅:399px;高さ:300px;border-left:#A8C29F ソリッド 1px;border-right:#A8C29F ソリッド 1px;border-top:0;background:#fefefe} .menudiv div{パディング:15px;行の高さ:28px;} .off{背景:#E0E2EB;カラー:#336699;フォントの太さ:太字} function setTab(name,cursel){ Cursel_0=カーセル; for(var i=1; i var menu = document.getElementById(name i); var menudiv = document.getElementById("con_" name "_" i); if(i==cursel){ メニュー.クラス名 = "オフ"; menudiv.style.display="ブロック"; } 他{ メニュー.クラス名=""; menudiv.style.display="none"; } } } 関数 Next(){ カーセル_0 ; if (cursel_0>links_len)cursel_0=1 setTab(name_0,cursel_0); } var name_0='1'; varcursel_0=1; var links_len,iIntervalId; onload=function(){ var links = document.getElementById("tab1").getElementsByTagName('li') リンク_len=リンクの長さ; for(var i=0; i links[i].onmouseover=function(){ クリアインターバル(iIntervalId); } } document.getElementById("con_" name_0 "_" links_len).parentNode.onmouseover=function(){ クリアインターバル(iIntervalId); } setTab(name_0,cursel_0); }

标签1 标签2 标签3 标签4 标签1-内容 标签2-内容 标签3-内容 标签4-内容