jQuery 滑动横幅 mouseout 不起作用

Question

当我将鼠标移出滑动图片时，setInterval函数无法重新启动again.The图片停止，不滑动anymore.It看来这段代码有问题" $ ("#wrapper-banner").mouseout(function(){timer()});"有人可以帮忙吗？非常感谢！

//slide banner
$("#wrapper-banner > div:gt(0)").hide();

 timer=setInterval(function() {
    $('#wrapper-banner > div:first')
        .fadeOut(1000)
        .next()
        .fadeIn(1000)
        .end()
        .appendTo('#wrapper-banner');
}, 4000);
$("#wrapper-banner").mouseover(function(){clearInterval(timer);})

$("#wrapper-banner").mouseout(function(){timer()});

Answer 1

setInterval 函数returns 计时器的句柄，不是函数。它不能像函数一样被调用来重新启动它。我相信你想要的是在同一个函数上第二次调用 setInterval 并替换计时器句柄。

//slide banner
$("#wrapper-banner > div:gt(0)").hide();

function moveNext() {
    $('#wrapper-banner > div:first')
        .fadeOut(1000)
        .next()
        .fadeIn(1000)
        .end()
        .appendTo('#wrapper-banner');
}

timer=setInterval(moveNext, 4000);
$("#wrapper-banner").mouseover(function(){clearInterval(timer);})

$("#wrapper-banner").mouseout(function()
{timer=setInterval(moveNext, 4000);});

jQuery 滑动横幅 mouseout 不起作用

jQuery sliding banner mouseout doesn't work

jquery

slider

setinterval

clearinterval