очистить интервал при наведении

Question

есть сделанный на заказ слайдер, который я бы хотел остановить при наведении курсора. Я пытался очистить и установить интервал при наведении, но не работает должным образом. Он останавливается только при первом наведении на него курсора, затем, если я вывожу мышь, и снова не останавливается.

вот мой код:

    var itvl = null;

    itvl = window.setInterval(function(){scroll_()},3000);

    function scroll_() {
        if ($('#carousel_ul li').length > 1) {
            $("#right_scroll").click();
        }
    }

    $('#carousel_ul li').hover(function() {
        window.clearInterval(itvl);    
    }, function() {
        window.setInterval(function(){scroll_()},3000);
    });

Есть идеи, что я делаю не так?

Заранее спасибо

Mauro

Answer 1

Когда вы устанавливаете интервал при зависании, вы не устанавливаете его. itvl на самом деле является целым числом, которое действует как ссылка на интервал. Таким образом, ссылка меняется, когда вы делаете window.setInterval(function(){scroll_()},3000);, ни на что не ссылаясь.

Попробуйте вместо этого:

$('#carousel_ul li').hover(function() {
    window.clearInterval(itvl);    
}, function() {
    itvl = window.setInterval(function(){scroll_()},3000);
});

Answer 2

$('#carousel_ul li').hover(function() {
    window.clearInterval(itvl);    
}, function() {
    itvl = window.setInterval(function(){scroll_()},3000);
});

Answer 3

Вы можете использовать логическую переменную вместо clearInterval:

    var scrolling= true;    
    window.setInterval(scroll_,3000);    
    function scroll_() {
        if(scrolling) {
            if ($('#carousel_ul li').length > 1) {
               $("#right_scroll").click();
            }
        }
    }    
    $('#carousel_ul li').hover(function() {
        scrolling = false;    
    }, function() {
        scrolling = true;
    });