Запустите анимацию при отпускании мыши и остановитесь при вводе мыши, используя setinterval и clearinterval - PullRequest
0 голосов
/ 09 июля 2019

Я использую карусель материализации, и она автоматически меняет слайды с помощью setInterval (), но я хочу, чтобы этот setInterval останавливался / пауза при наведении курсора и перезапускался при неосторожном обращении.

Я пытался использовать clearinterval, но он не работает идеально.

$(document).ready(function(){

    $('.carousel').carousel(); // Start carousel

    /*  I WAS USING THIS BEFORE JUST FOR CHANGING SLIDES AUTOMATICALLY
    setInterval(function(){
        $('.carousel').carousel('next');
    },2500);
    });
    */

    // THIS IS WHAT IHAVE TRIED

    var myVar;

    function start(){
        var myVar = setInterval(next, 2500);
        function next() {
            $('.carousel').carousel('next');
        }
    }

    function stop() {
        clearInterval(myVar);
        myVar = 0;
    }

    $('.carousel').mouseenter(function(){stop();});
    $('.carousel').mouseleave(function(){start();});

    start();
});

Код не выдает никакой ошибки.

1 Ответ

0 голосов
/ 09 июля 2019

Замените эту строку:

var myVar = setInterval(next, 2500);

на это:

myVar = setInterval(next, 2500);

Вы определили глобальную переменную, и в вашей функции start вы снова инициализируете переменную и присваиваетевозвращаемое значение setInterval к нему.Это означает, что myVar остается не назначенным для оставшегося кода, кроме функции start.поэтому clearInterval не работает.

Вам просто нужно присвоить возвращаемое значение глобальной переменной myVar, и это работает для вас.

...