Working Example在这里 - 添加/编辑到URL的代码
你只需要使用JavaScript setInterval
功能
$('html').addClass('js');
$(function() {
var timer = setInterval(showDiv, 5000);
var counter = 0;
function showDiv() {
if (counter ==0) { counter++; return; }
$('div','#container')
.stop()
.hide()
.filter(function() { return this.id.match('div' + counter); })
.show('fast');
counter == 3? counter = 0 : counter++;
}
});
和HTML玩
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<title>Sandbox</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<style type="text/css" media="screen">
body { background-color: #fff; font: 16px Helvetica, Arial; color: #000; }
.display { width:300px; height:200px; border: 2px solid #000; }
.js .display { display:none; }
</style>
</head>
<body>
<h2>Example of using setInterval to trigger display of Div</h2>
<p>The first div will display after 10 seconds...</p>
<div id='container'>
<div id='div1' class='display' style="background-color: red;">
div1
</div>
<div id='div2' class='display' style="background-color: green;">
div2
</div>
<div id='div3' class='display' style="background-color: blue;">
div3
</div>
<div>
</body>
</html>
编辑:
在回答你关于容器DIV评论,只是修改此
$('div','#container')
这个
$('#div1, #div2, #div3')
Russ感谢您对帖子的快速回复。在你的例子中,它显示我们需要有一个div容器,并且我们需要有其他div。但是我的div并不在其容器内部。如何相应地修改代码? – Webrsk 2009-05-27 10:40:27
你有权限修改HTML吗?如果是这样,我会建议将div包装在容器div中以便于选择。如果没有容器div,代码将需要修改,以便只选择那些有问题的div,即带有ID 1,2和3的div。我现在更新我的答案 – 2009-05-27 10:44:50