Javascript 悬停幻灯片放映

我有下面的脚本来运行幻灯片，效果很好

jQuery(document).ready(function ($) {


setInterval(function () {
    moveRight();
}, 5000);


var slideCount = $('#slider ul li').length;
var slideWidth = $('#slider ul li').width();
var slideHeight = $('#slider ul li').height();
var sliderUlWidth = slideCount * slideWidth;

$('#slider').css({ width: slideWidth, height: slideHeight });

$('#slider ul').css({ width: sliderUlWidth, marginLeft: - slideWidth });

$('#slider ul li:last-child').prependTo('#slider ul');

function moveLeft() {
    $('#slider ul').animate({
        left: + slideWidth
    }, 500, function () {
        $('#slider ul li:last-child').prependTo('#slider ul');
        $('#slider ul').css('left', '');
    });
};

function moveRight() {
    $('#slider ul').animate({
        left: - slideWidth
    }, 500, function () {
        $('#slider ul li:first-child').appendTo('#slider ul');
        $('#slider ul').css('left', '');
    });
};

$('a.control_prev').click(function () {
    moveLeft();
});

$('a.control_next').click(function () {
     moveRight();
});
});

但是我想让它在鼠标悬停时暂停，我尝试了一些我在这里找到的其他建议（包括下面的建议），但无法使它们中的任何一个与我的代码一起工作。 有什么想法吗？谢谢

$("#slider ul").mouseover(function() {
$("#slider ul").trigger('pause', true);
});

您可以使用

.stop（）

，

clearInterval（）

---

您可以使用

clearInterval（）

删除间隔。

希望这有助于：

var timerObject=null; 

function StartSlide(){
timerObject = setInterval(function () {
    moveRight();
}, 5000);
}

function stopSlide(){
clearInterval(timerObject)
}

$("#slider ul").mouseover(function() {
stopSlide()
});

$("#slider ul").mouseleave(function() {
StartSlide()
});

---

示例：

这确实使滑鼠在滑鼠上方停止滑动，但它取消了自动启动功能。所以只有在鼠标离开后才会开始=/clearInterval（）是一个与setInterval（）完全相反的函数。

var timerObject=null; 

function StartSlide(){
timerObject = setInterval(function () {
    moveRight();
}, 5000);
}

function stopSlide(){
clearInterval(timerObject)
}

$("#slider ul").mouseover(function() {
stopSlide()
});

$("#slider ul").mouseleave(function() {
StartSlide()
});

.stop() | jQuery API