请js大神帮忙看下这段jquery选项卡怎么实现定时多少秒自动切换

$(document).ready(function(){varlen=$("ul#tab").find("li").length;for(i=0;i<len;i++){... $(document).ready(function(){
var len=$("ul#tab").find("li").length;
for(i=0;i<len;i++){
$("ul#tab").find("li").eq(i).click(function(){

$(this).addClass("current");
$(this).siblings("li").removeClass("current");

$("div#content").children("ul").css("display","none")
$("div#content").children("ul").eq($(this).index()).css("display","block"）

})
}
})
<div id="outer">
<ul id="tab">
<li class="current">科技</li>
<li>旅游</li>
<li>娱乐</li>
</ul>
<div id="content">
<ul style="display:block;">
<li>宏碁R7双转轴变形本评测：触摸板设计过于另类(图)</li>
</ul>
<ul >
<li>爱上西雅图，美国全景游精选推荐</li>
</ul>
<ul >
<li>李安宣布辞拍美剧《暴君》：需要休息</li>
</ul>
</div>

</div> 展开

 我来答

1个回答

#热议# 应届生在签三方时要注意什么？

匿名用户
推荐于2016-07-23

展开全部

<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>menu</title>
<style type="text/css">
.current {
	background-color: red;
}
</style>
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript">
	$ (document).ready (function ()
    {
	    var tab = $ ("ul#tab"), content = $ ("div#content"), tls = tab.children ("li");
	    
	    $("div#outer").hover (function ()
	    {
		    stop ();
	    }, function ()
	    {
		    run (tls);
	    });
	    
	    tls.click (function ()
	    {
		    var me = $ (this);
		    me.addClass ("current").siblings ("li").removeClass ("current");
		    content.children ("ul:eq(" + me.index () + ")").show ().siblings ("ul").hide ();
	    });
	    content.children ("ul:not(:eq(" + tls.filter ("li.current").index () + "))").hide ();
	    run (tls);
    });
    
    var INTERVAL = null, SLEEP = 1000;
    var run = function (tls)
    {
	    if (!INTERVAL)
	    {
		    INTERVAL = setInterval (function ()
		    {
			    var index = tls.filter ("li.current").index ();
			    index++;
			    index = index > tls.length - 1 ? 0 : index;
			    tls.filter ("li:eq(" + index + ")").triggerHandler ("click");
		    }, SLEEP);
	    }
    };
    
    var stop = function ()
    {
	    if (!!INTERVAL)
	    {
		    clearInterval (INTERVAL);
		    INTERVAL = null;
	    }
    }
</script>
</head>
<body>
	<div id="outer">
		<ul id="tab">
			<li class="current">科技</li>
			<li>旅游</li>
			<li>娱乐</li>
		</ul>
		<div id="content">
			<ul style="display: block;">
				<li>宏碁R7双转轴变形本评测：触摸板设计过于另类(图)</li>
			</ul>
			<ul>
				<li>爱上西雅图，美国全景游精选推荐</li>
			</ul>
			<ul>
				<li>李安宣布辞拍美剧《暴君》：需要休息</li>
			</ul>
		</div>
	</div>
</body>
</html>

已赞过 已踩过<

评论收起

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

请js大神帮忙看下 这段jquery选项卡 怎么实现定时多少秒自动切换

为你推荐：

请js大神帮忙看下这段jquery选项卡怎么实现定时多少秒自动切换