<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
*{margin:0;padding:0;}
ul{list-style:none;}
.clear{clear:both;}
.wrap{width:800px; margin-bottom:20px;}
.tap ul{height:40px;}
.tap ul .act{float:left; padding:0 20px; height:40px; line-height:40px; background:#F358F2;}
.tap li{float:left; padding:0 20px; height:40px; line-height:40px;}
.tap li a{color:#333; display:block;}
.wrap .chance{}
.wrap .chance div{border:2px solid #D4002E; width:800px; height:300px;}
.wrap .chance .a{display:none;}
</style>
</head>
<body>
<div class="wrap">
<div class="tap">
<ul>
<li class="act"><a href="javascript:;">tab1</a></li>
<li><a href="javascript:;">tab2</a></li>
<li><a href="javascript:;">tab3</a></li>
<li><a href="javascript:;">tab4</a></li>
</ul>
</div>
<div class="chance clear">
<div class="hider">你吃粪儿</div>
<div class="hider a">他吃啥</div>
<div class="hider a">缠缠黏黏</div>
<div class="hider a">好粘牙</div>
</div>
</div>
<div class="wrap">
<div class="tap">
<ul>
<li class="act"><a href="javascript:;">tab1</a></li>
<li><a href="javascript:;">tab2</a></li>
<li><a href="javascript:;">tab3</a></li>
<li><a href="javascript:;">tab4</a></li>
</ul>
</div>
<div class="chance clear">
<div class="hider">你吃粪儿</div>
<div class="hider a">他吃啥</div>
<div class="hider a">缠缠黏黏</div>
<div class="hider a">好粘牙</div>
</div>
</div>
</body>
</html>
<script>
function run(obj){
//找对象
var oUl=obj.getElementsByTagName('ul')[0];
var aLi=oUl.getElementsByTagName('li');
var aDiv=obj.getElementsByClassName('hider');
//绑事件,循环
for(var i=0;i<aLi.length;i++){
aLi[i].index=i//发牌照
aLi[i].onclick=function(){
for(var j=0;j<aLi.length;j++){
aLi[j].className='';//清空类名
aDiv[j].style.display='none';//隐藏
};
this.className='act';
aDiv[this.index].style.display='block';//显示
};
};
//----------------------
//自动播放
var n=0;//计数器
var timer=setInterval(function(){
n++;
if(n==aLi.length){
n=0;
};
for(var j=0;j<aLi.length;j++){
aLi[j].className='';//清空类名
aDiv[j].style.display='none';//隐藏
};
aLi[n].className='act';
aDiv[n].style.display='block';
},1000);
obj.onmouseover=function(){
clearInterval(timer);//清除计时器
};
obj.onmouseout=function(){
run(obj);//再运行
};
};
//----------------------------
var aWarp=document.getElementsByClassName('wrap');
run(aWarp[0]);
run(aWarp[1]);
</script>
//-------------------------------------------------------
我想请教,如果我想在js的function run的小括号那里再加上一个参数,比如加上一个autoran,然后在最后判断为true时让选项卡自动切换,否则就停止自动该怎么写?
相关分类