Javascript 另一个jQuery滑块在悬停时暂停

我一直在寻找一种暂停我正在使用的滑块的方法，我有一种印象，那就是我可以合并一个简单的.mouseenter（）.mouseleave（）函数（对JS来说还是相当新的），我看到的似乎表明它只取决于你正在使用的代码是如何构造的。我现在有点不知所措，因此非常感谢您的帮助-我的代码如下：

        <div id="slideshow">
            <div class="vertical">
                <img src="" />
            </div>
            <div class="vertical">
                <img src="" />
            </div>
            <div class="vertical">
                <img src="" />
            </div>
        </div>

$("#slideshow > div:gt(0)").hide();
setInterval(function() { 
$('#slideshow > div:first')
.fadeOut()
.next()
.fadeIn(500)
.end()
.appendTo('#slideshow');
},  4500);

$（“#幻灯片>div:gt（0）”）.hide（）；
setInterval（函数（）{
$（“#幻灯片>分区：第一个”）
.fadeOut（）
.next（）
法丹先生（500）
(完)
.appendTo（“#幻灯片”）；
},  4500);

我把这归咎于我的过敏发作yday，因为我还没有得到它——我用一种不同的方法实现了我想要的

干杯，所以！调整后的代码如下：

$(function(){
SliderStartStop();
$('#slideshow').hover(function(){clearInterval(sliderInt);},SliderStartStop);
});
function SliderStartStop(){
$("#slideshow > div:gt(0)").hide();
sliderInt = setInterval(function() { 
$('#slideshow > div:first')
.fadeOut()
.next()
.fadeIn(500)
.end()
.appendTo('#slideshow');
},  4500);}

我已经创建了一个JSFIDLE

以下是JS代码：

$("#slideshow > div:gt(0)").hide();
timer = setInterval(function() { 
  $('#slideshow > div:first')
  .fadeOut()
  .next()
  .fadeIn(300)
  .end()
  .appendTo('#slideshow');
  },  1500);

$('#slideshow').hover(function(){
    clearInterval(timer);
}, function(){
  timer();
});

---

我提高动画的速度只是为了看它是否有效：）

你是否使用一些库来播放幻灯片？嗨，文森特！除了定义的图像、jQuery和CSS之外，此滑块中没有使用任何其他内容。@Zeus77，您建议的编辑中的变量否定了我所追求的最终结果。这样，Vincent也能工作。谢谢你，先生，非常感谢！使用此方法时，我注意到的唯一一点是，在初始加载时，所有幻灯片都会同时显示。不客气，别忘了验证；）是的，我删除了你的$（“#slideshow>div:gt（0）”）.hide（）；当我更新它的时候，我会把它放回去。