js实现tab选项卡函数代码_javascript技巧

来源：动视网责编：小采时间：2020-11-27 20:48:50

js实现tab选项卡函数代码_javascript技巧

js实现tab选项卡函数代码_javascript技巧: * { padding-bottom: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; font-size: 12px; padding-top: 0px; } BODY { padding-left: 20px; padding-top: 20px; } .wid240 { width: 242px; margin-bottom: 20px; } .wid180 { width: 182px; } .

推荐度：

点击下载本文 文档为doc格式

导读js实现tab选项卡函数代码_javascript技巧: * { padding-bottom: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; font-size: 12px; padding-top: 0px; } BODY { padding-left: 20px; padding-top: 20px; } .wid240 { width: 242px; margin-bottom: 20px; } .wid180 { width: 182px; } .

<html> 
<head> 
<style type="text/css"> 
* 
{ 
padding-bottom: 0px; 
margin: 0px; 
padding-left: 0px; 
padding-right: 0px; 
font-size: 12px; 
padding-top: 0px; 
} 
BODY 
{ 
padding-left: 20px; 
padding-top: 20px; 
} 
.wid240 
{ 
width: 242px; 
margin-bottom: 20px; 
} 
.wid180 
{ 
width: 182px; 
} 
.tab 
{ 
border-bottom: #000 1px solid; 
border-left: #000 1px solid; 
border-top: #000 1px solid; 
border-right: #000 1px solid; 
} 
.tab UL 
{ 
zoom: 1; 
clear: both; 
} 
.tab UL:after 
{ 
display: block; 
height: 0px; 
visibility: hidden; 
clear: both; 
content: ""; 
} 
.tab UL LI 
{ 
text-align: center; 
line-height: 26px; 
width: 60px; 
display: inline; 
background: #000; 
float: left; 
height: 26px; 
color: #fff; 
} 
.tab UL LI.on 
{ 
background: #fff; 
color: #000; 
} 
.tabList 
{ 
border-bottom: #000 1px solid; 
border-left: #000 1px solid; 
height: 150px; 
border-top: #000 1px; 
border-right: #000 1px solid; 
} 
.tabList .one 
{ 
padding-bottom: 10px; 
padding-left: 10px; 
padding-right: 10px; 
display: none; 
color: #ff0000; 
padding-top: 10px; 
} 
.tabList .block 
{ 
display: block; 
} 
</style>

function setTab(name,m,n){ 
for( var i=1;i<=n;i++){ 
var menu = document.getElementById(name+i); 
var showDiv = document.getElementById("cont_"+name+"_"+i); 
menu.className = i==m ?"on":""; 
showDiv.style.display = i==m?"block":"none"; 
} 
} 
</ script>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

js实现tab选项卡函数代码_javascript技巧

推荐度：

点击下载本文 文档为doc格式

标签： js 代码 tab

热门焦点

js实现tab选项卡函数代码_javascript技巧

js实现tab选项卡函数代码_javascript技巧

js实现tab选项卡函数代码_javascript技巧

最新推荐

猜你喜欢

热门推荐