Jquery淡入,一起淡出一些元素

Jquery fade in, fade out some elements together

本文关键字:元素 淡出 一起 淡入 Jquery      更新时间:2023-09-26

我需要淡出并淡入<div>中的一些子元素,就像托尼·阿尔梅达的答案一样:

入和淡出图像

 <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>

我应该如何编辑该答案中的代码?

这是我

修改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);

小提琴:http://jsfiddle.net/HewAd/

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/

正确吗?