鼠标悬停时褪色的jQuery幻灯片闪烁/队列问题（slideSwitch.js）答案

【问题标题】：Fading jQuery slideshow flicker / queue problem on mouseover (slideSwitch.js)鼠标悬停时褪色的jQuery幻灯片闪烁/队列问题（slideSwitch.js）
【发布时间】：2011-03-22 02:44:48
【问题描述】：

我改编了 Jon Raasch 的 slideSwitch.js tutorial 中的代码，这基本上是一个褪色的幻灯片。该脚本将“活动”幻灯片提升到更高的 z-index，并为不透明度设置动画以实现褪色效果。

添加暂停以在鼠标悬停时暂时停止幻灯片放映，效果很好。

我遇到的问题是，当反复将鼠标悬停在幻灯片上/离开幻灯片时，我试图阻止脚本排队。发生这种情况时，它会闪烁并发疯。

我已经尝试了 stop()，但没有让它正常工作。

有人可以告诉我在下面的代码中插入的位置吗？或者如果我做错了！

干杯

卢克

function slideSwitch() {
var $active = $('#hp-featured div.active');
if ( $active.length == 0 ) $active = $('#hp-featured div:last');
var $next =  $active.next().length ? $active.next()
    : $('#hp-featured div:first');
$active.addClass('last-active');
$next.css({opacity: 0.0})
    .addClass('active')
    .animate({opacity: 1.0}, 1000, function() {
        $active.removeClass('active last-active');
    });
}
$(function() {
    var playSlideshow =  setInterval( "slideSwitch()", 5000 ); 
 $('#hp-featured div').hover(function() {
     clearInterval(playSlideshow);
  },
  function() {
      playSlideshow =  setInterval( "slideSwitch()", 5000 );
  });
});

【问题讨论】：

使用.stop(true, true)。这很丑，但有时它是让某些视觉效果发挥作用的唯一方法。
我已经尝试过了，但我不知道该放在哪里。你会在哪里建议？

标签： jquery jquery-plugins jquery-animate slideshow mouseover

【解决方案1】：

好的，我解决了这个问题，问题不在于代码，而在于父“幻灯片”div 内嵌套了一个额外的 div。该函数同时触发了它们并造成了混乱。

干杯

【讨论】：