我需要淡出并淡出<div>
中的一些子元素,就像Toni Almeida一样:
<div class="display" id="slideshow">
<a class="slice" href="myUrl1">
<div class="caption">Some text1...</div>
<img src="AnyUrl1" width="360" height="300"/>
</a>
<a class="slice" href="myUrl2">
<div class="caption">Some text2...</div>
<img src="AnyUrl2" width="360" height="300"/>
</a>
<a class="slice" href="myUrl3">
<div class="caption">Some text3...</div>
<img src="AnyUrl3" width="360" height="300"/>
</a>
.......
</div>
我该如何编辑该答案中的代码?
答案 0 :(得分:2)
var count = 1;
var $slideShow = $("#slideshow");
var $prevSlice;
var $nextSlice;
setInterval(function() {
$prevSlice = $slideShow.find(".slice:nth-child("+count+")");
count = ($prevSlice.next().length == 0) ? 1 : count+1;
$nextSlice = $slideShow.find(".slice:nth-child("+count+")");
$prevSlice.fadeOut();
$nextSlice.fadeIn();
}, 2000);
这是一个小提琴:http://jsfiddle.net/KA4Zq/308/
这是对的吗?
答案 1 :(得分:2)
以下是我的js
代码已修改为可与您的html
合作:
var count = 1;
setInterval(function() {
count = ($("#slideshow").find(".slice:nth-child("+count+")").fadeOut().next().length == 0) ? 1 : count+1;
$("#slideshow").find(".slice:nth-child("+count+")").fadeIn();
}, 2000);