Deliver переменных между двумя функциями

Question

я использую этот простой скрипт для создания некоторого слайдера, который, начиная с MouseEnter и который должен остановится на MouseLeave:

$(".grid-item").mouseenter(function() { 

    var slides = $(this).find(".slide-image"), 
     counter = 0; 

    var test = setInterval(function(){ 
    slides.removeClass('active'); 
    slides.eq(counter).addClass('active'); 
    counter++; 

    if (counter > slides.length) {counter = 0;}; 
    }, 600); 

}).mouseleave(function() { 

    clearInterval(test); 
    // $(".slide-image").removeClass('active'); 

}); 

Слайдера начинается довольно хорошо, но на MouseLeave-событиях I 'm получить консольную ошибку «Неотдача ReferenceError: тест не определен». Я думаю, это потому, что переменная интервала не передается во второй функции. Есть ли решение?

Check out my CodePen! (Он отлично работает здесь)

Answer 1

возвещать переменную test вне функции

var test; 
$(".grid-item").mouseenter(function() { 

    var slides = $(this).find(".slide-image"), 
     counter = 0; 

    test = setInterval(function(){ 
    slides.removeClass('active'); 
    slides.eq(counter).addClass('active'); 
    counter++; 

    if (counter > slides.length) {counter = 0;}; 
    }, 600); 

}).mouseleave(function() { 

    clearInterval(test); 
    // $(".slide-image").removeClass('active'); 

});