jQuery幻灯片不会淡入淡出答案

【问题标题】：jQuery Slideshow wont fade in and outjQuery幻灯片不会淡入淡出
【发布时间】：2014-06-25 07:28:38
【问题描述】：

自从我删除 .end() 后，我的滑块不会淡入，因为这给我在幻灯片放映中带来了一些问题，但我怎样才能让它再次淡入和淡出。它适用于我制作的小提琴，但不适用于我的网站。 http://jsfiddle.net/HUkBp/2/

我的代码：

 <div id="slideshow">
   <div>
     <img src="imgs/supp1.jpg">
   </div>
   <div>
     <img src="imgs/supp2.jpg">
   </div>
   <div>
     <img src="imgs/supp3.jpg">
   </div>
   <div>
     <img src="imgs/supp4.jpg">
   </div>
   <div>
     <img src="imgs/supp5.jpg">
   </div>
   <div>
     <img src="imgs/supp6.jpg">
   </div>
   <div>
     <img src="imgs/supp8.jpg">
   </div>
   <div>
     <img src="imgs/supp9.jpg">
   </div>
   <div>
     <img src="imgs/supp10.jpg">
   </div>
 </div>

CSS：

#slideshow { 
    margin: 50px auto; 
    position: relative;   
}

#slideshow > div { 
    position: absolute; 
}

jQuery:

$("#slideshow > div:gt(0)").hide();

setInterval(function() { 
  $('#slideshow > div:first')
    .fadeOut(1000)
    .next()
    .fadeIn(1000)
    .appendTo('#slideshow');
},  3000);

【问题讨论】：

您尝试过在您的setInterval (...) 中不使用.end() 吗？
它修复了滑块后退的问题，但现在滑块不会褪色，它们只是出现，但它的东西哈哈已经感谢了：D
This JSFiddle 可以帮助你。在您的网站上尝试它的 js。我刚刚将您的setInterval (...) 切成两部分并删除了.next()。希望对你有帮助。
@Rofez 最好避免在 cmets 中回答，因为这个问题将永远得不到回答（除非问题是由印刷错误引起的并被社区关闭）。请考虑添加带有一些解释的答案。
@Tilwin Joy 是的，我知道，但我对此没有真正的解释，所以我希望你们中的一个人能找到为什么这不适用于我的代码以发布完整的答案和完整的解释。

标签： javascript jquery html css slider

【解决方案1】：

您不应该删除.end()，因为您需要将第一张幻灯片移至幻灯片的结尾。如果没有.end()，第二个将被移动。所以你有正确的代码：

setInterval(function() { 
    $('#slideshow > div:first')
    .fadeOut(1000)
    .next()
    .fadeIn(1000)
    .end()
    .appendTo('#slideshow');
},  3000);

你能提供一个链接到你的网站，它不起作用吗？

【讨论】：