Question

在http://judi.simpleupdates.com/上我尝试使用jQuery fadeIn和fadeOut效果在网页上制作图片幻灯片。这两个项fadeIn没有问题。但是，fadeOut并未更改应该消失的display的{{1}}属性。任何想法为什么这可能没有按预期工作？

这是失败的行：

div

更新：对于没有$( ".carousel_item:nth-child(" + selected + ")" ).fadeOut(600);和fadeOut的元素，问题似乎与width有关。将值添加到height的{{1}}和width属性后，height调用可正常运行。另一种方法是从后代div.carousel_item中删除fadeOut，从而使position: absolute增长到img维度。

Answer 1

对于没有fadeOut和width的元素，问题似乎与height一致。将值添加到width的{{1}}和height属性时div.carousel_item调用正常工作。另一种方法是从后代fadeOut中删除position: absolute，从而导致img增长到div维度。

感谢您的所有帮助和建议！

Answer 2

~~将HTML中的显示设置更改为<div id="txt2" class="carousel_item" style="display: none; ">应正确触发fadeIn / fadeOut。~~

~~您可能还需要将jQuery更改为： $( ".carousel_item:nth-child(" + selected + ")" ).fadeOut(600).hide();~~

~~您在同时设置为display: block的项目上调用fadeIn / fadeOut。它需要备用状态才能工作。~~

<强>更新下载站点的本地副本后，将js中的showhide（）函数更改为：

var inc = 1
function showhide(current) {
    if (inc == 1) current = 2;
    $( ".carousel_item:nth-child(" + selected + ")" ).fadeIn(600);
    $( ".carousel_item:nth-child(" + current + ")" ).fadeOut(600).hide();
    selected = current;
    inc++;
}

适用于我的测试。希望它适合你。我添加了计数器，因为您的初始计数似乎将selected和current都设置为1。

Answer 3

可能只是你必须在jQuery-selector中相互替换当前和所选变量？当我理解正确的时候你想淡出当前并淡化所选择的，不是吗？

jQuery fadeOut没有改变显示属性

3 个答案: