我有几个DIV,想一一展示。
首先,它们都应该display:none;
在 CSS 中,然后我需要一些jQuery脚本,我不知道如何编写。
一次只能看到一个元素,延迟应该在 2 秒左右。顺序是:
- 2 秒内无元素
- 第一个元素可见 2 秒。
- 2 秒内无可见元素
- 第二个元素可见可见 2 秒
- 等等... +循环
谢谢!
这是我到目前为止所做的事情的链接。我知道,这不是一种优雅的方式。此外,它不会在最后一个元素打开后循环停止。 http://jsbin.com/uwubah/7/
HTML:
<div class="dezute">dezute</div>
<div class="kubikas">kubikas</div>
<div class="zirkles">zirkles</div>
<div class="telefonas">telefonas</div>
<div class="izoliacija">izoliacija</div>
<div class="dainuoja">dainuoja</div>
CSS:
.dezute, .kubikas, .zirkles, .telefonas, .izoliacija, .dainuoja{
display: none;
}
问:
$(document).ready(function() {
setTimeout(function() {
$('.dezute').fadeIn();
}, 2000);
});
$(document).ready(function() {
setTimeout(function() {
$('.dezute').fadeOut();
$('.kubikas').fadeIn();
}, 4000);
});
$(document).ready(function() {
setTimeout(function() {
$('.dezute').fadeOut();
$('.kubikas').fadeOut();
$('.zirkles').fadeIn();
}, 6000);
});
$(document).ready(function() {
setTimeout(function() {
$('.dezute').fadeOut();
$('.kubikas').fadeOut();
$('.zirkles').fadeOut();
$('.telefonas').fadeIn();
}, 8000);
});
$(document).ready(function() {
setTimeout(function() {
$('.dezute').fadeOut();
$('.kubikas').fadeOut();
$('.zirkles').fadeOut();
$('.telefonas').fadeOut();
$('.izoliacija').fadeIn();
}, 10000);
});
$(document).ready(function() {
setTimeout(function() {
$('.dezute').fadeOut();
$('.kubikas').fadeOut();
$('.zirkles').fadeOut();
$('.telefonas').fadeOut();
$('.izoliacija').fadeOut();
$('.dainuoja').fadeIn();
}, 12000);
});