《2022年选项卡切换代码 3.pdf》由会员分享,可在线阅读,更多相关《2022年选项卡切换代码 3.pdf(7页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、求助选项卡切换代码2010-1-28 20:08 提问者:c346819739| 浏览次数: 2235 次 .nTab float: left; width: 100%; margin: 0 auto; border-bottom:1px #AACCEE solid; background:#d5d5d5; background-position:left; background-repeat:repeat-y; margin-bottom:2px; .nTab .TabTitle clear: both; height: 22px; overflow: hidden; .nTab .TabT
2、itle ul border:0; margin:0; padding:0; .nTab .TabTitle li float: left; width: 70px; cursor: pointer; padding-top: 4px; padding-right: 0px; padding-left: 0px; padding-bottom: 2px; list-style-type: none; font-size: 12px; text-align: center; margin: 0; .nTab .TabTitle .activebackground:#fff;border-left
3、:1px #AACCEE solid;border-top:1px #AACCEE solid;border-right:1px #AACCEE solid;border-bottom:1px #fff solid; .nTab .TabTitle .normalbackground:#EBF3FB;border:1px #AACCEE solid; .nTab .TabContent width:auto;background:#fff; 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - -
4、 第 1 页,共 7 页 - - - - - - - - - margin: 0px auto; padding:10px 0 0 0; border-right:1px #AACCEE solid;border-left:1px #AACCEE solid; .none display:none; function nTabs(thisObj,Num) if(thisObj.className = active)return; var tabObj = thisObj.parentNode.id; var tabList = document.getElementById(tabObj).g
5、etElementsByTagName(li); for(i=0; i tabList.length; i+) if (i = Num) thisObj.className = active; document.getElementById(tabObj+_Content+i).style.display = block; else tabListi.className = normal; document.getElementById(tabObj+_Content+i).style.display = none; aaa bbb ccc 单击 000 111 222 333 名师资料总结
6、- - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 2 页,共 7 页 - - - - - - - - - 以上的是可行的,但改了以下的就切换不到,我知道问题,但是不会改 li class=active onclick=nTabs(this,); 000 111 222 333 我来帮他解答2010-2-3 13:59 满意回答这是我做的不知道你有没有用 简洁 Tab !- /*第一种形式第二种形式更换显示样式 */ function setTab(name,cursel,n) for(i=1;i 手
7、机充值 网上银行充值 支付宝充值 手机充值卡充值 金币账户充值 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 4 页,共 7 页 - - - - - - - - - 新闻列表 1 新闻列表 2 新闻列表 3 新闻列表 4 新闻 sssssssssssssssssssss列表 5 手机充值 网上银行充值 支付宝充值 手机充值卡充值 金币账户充值 新闻列表 1 新闻列表 2 新闻列表 3 新闻列表 4 新闻 sssssssssssssssssssss列表 5 js 选项卡 body f
8、ont-size:12px; .sec,.sec1 cursor:pointer; .sec color:#FFFFFF; font-weight:bold; text-align:center; background-color:#990000; 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 5 页,共 7 页 - - - - - - - - - .sec1 color:#990000; text-align:center; background-color:#FFFFFF; d
9、iv line-height:22px; function $(id) return document.getElementById(id); function xxk(num,id,ii,iii) /alert(ii); var dq; for(var i=1;i=num;i+) if(i=id) dq=$(ii+i).className=sec; /当前选项$(iii+i).style.display=block; else dq=$(ii+i).className=sec1; $(iii+i).style.display=none; 选项卡 1 选项卡 2 选项卡 3 选项卡 4 选项卡 5 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 6 页,共 7 页 - - - - - - - - - 选项卡 1 月在上班 选项卡 2 月在上班 选项卡 3 月在上班 选项卡 4 月在上班 选项卡 5 月在上班 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 7 页,共 7 页 - - - - - - - - -