JS选项卡自动切换怎么写?
要攺一下link的路径
选项卡怎么切换.rar
(1.84 KB)
程序代码：<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>选项卡</title>
<link rel="stylesheet" type="text/css" href="css/选项卡.css"/>
<script type="text/javascript">
window.onload = function(){
var oUl1 = document.getElementsByClassName('menu')[0];
var oUl2 = document.getElementsByClassName('menu')[1];
var aLi1 = oUl1.children; //ka1的li集合
var aLi2 = oUl2.children; //ka2的li集合
//arr:选项卡节点集合. parent_id : 与选项卡相关联的DIV的父级ID.Auto:自动轮换开关(0/1),time:轮换时间设置;
function onmouseover(arr,parent_id,Auto,times){
var oParent = document.getElementById(parent_id);
var aParent = oParent.getElementsByTagName('div');
var fnA = function (){
for (var i = 0; i < arr.length; i++) {
arr[i].index = i;
arr[i].onmouseover = function (){
for (var i = 0; i < arr.length; i++) {
arr[i].className = 'tabs';
aParent[i].style.display = 'none';
}
this.className = ' tabs over';
aParent[this.index].style.display = 'block';
}
}
}
var t = null; //定时器
if(Auto){
//当鼠标离开选项卡区域2秒后,激活定时器
oParent.onmouseout = function (){
setTimeout(function (){
/*
*这里要怎么写?
*
* t = setInterval.....
*
* */
},2000);
}
//鼠标在选项卡上时,禁用定时器,并执行fnA()
oParent.onmouseover = function (){
clearInterval(t);
fnA();
}
} else { //设置为手动时
fnA();
}
}
onmouseover(aLi1,'ka1',1,3000);
onmouseover(aLi2,'ka2',0);
}
</script>
</head>
<body>
<div id="container" class="container">
<div id="ka1" class="ka">
<ul class="menu">
<li class="tabs over">AAA</li>
<li class="tabs">BBB</li>
<li class="tabs">CCC</li>
<li class="tabs">DDD</li>
</ul>
<div class="main" style="display: block;">AAA</div>
<div class="main">BBB</div>
<div class="main">CCC</div>
<div class="main">DDD</div>
</div>
<div id="ka2" class="ka">
<ul class="menu">
<li class="tabs over">AAA</li>
<li class="tabs">BBB</li>
<li class="tabs">CCC</li>
<li class="tabs">DDD</li>
</ul>
<div class="main" style="display: block;">AAA</div>
<div class="main">BBB</div>
<div class="main">CCC</div>
<div class="main">DDD</div>
</div>
</div>
</body>
</html>[此贴子已经被作者于2016-6-18 12:01编辑过]
