Question

我试图修改下面的一段代码，以便不会发生淡出功能。我希望下一个图像淡出现有图像。任何人都可以帮忙，因为我已经尝试删除fadeOut功能，但它不起作用。

$(function () {

    var changeTime = 5000;
    var speed = 1500;

    var slider = $("#imageSlide"),
        listItems = slider.children('li'),
        listLen = listItems.length,
        i = 0,

        changeList = function () {

            listItems.eq(i).fadeOut(speed, function () {
                i += 1;
                if (i === listLen) {
                    i = 0;
                }
                listItems.eq(i).fadeIn(speed);
            });

        };

    listItems.not(':first').hide();
    setInterval(changeList, changeTime);

});

我有的是：

#imageSlide {
margin:0;
padding:0;
}
ul#imageSlide {
list-style:none;
list-style-image:none;
margin-left:0px;
}
li#imageSlide {
position:absolute;
top:0;
left:0;
}

HTML标记是：

<ul id="imageSlide">
<li><img alt="" src="/Images/image1.jpg" /></li>
<li><img alt="" src="/Images/image2.jpg" /></li>
<li><img alt="" src="/Images/image3.jpg" /></li>
<li><img alt="" src="/Images/image4.jpg" /></li>
<li><img alt="" src="/Images/image5.jpg" /></li>

Answer 1

您是否曾尝试删除此类fadeOut

$(function () {

var changeTime = 5000;
var speed = 1500;

var slider = $("#imageSlide"),
    listItems = slider.children('li'),
    listLen = listItems.length,
    i = 0,

    changeList = function () {
        i += 1;
        if (i === listLen) {
            i = 0;
        }
        listItems.eq(i).fadeIn(speed);
    };

listItems.not(':first').hide();
setInterval(changeList, changeTime);

});

Answer 2

您的代码正常运行，您包含页面中的任何jquery version

查看工作Demo1和Demo2以及Demo3

而Demo4没有 fadeOut

jquery图像滑块修改

2 个答案: