새로 고침 setInterval on Hover

Question

단순히 한 값으로 조작하여 페이지에 4 초마다 그림을 변경하는 setInterval() 함수가 있습니다.

setInterval(function(){ 
    changeSlide(slideNumber); 
    slideNumber++; 
    if(slideNumber===5)slideNumber=0; 
},4000); 

이 값은 slideNumber입니다.

당신이 요소에 mouseenter 이동 사진이 제자리에 유지해야하기 때문에, 간격이 중지해야합니다 (ID가 = "hoverElement"말할 수), 내 changeSlide 쇼와 사람들을 숨기기 : 내가 원하는 이제

, 영화.

그리고 마우스를 놓으면 4000ms를 기다린 후 계속합니다.

어떻게하면됩니까?

는

편집 :

죄송합니다, 그것은

이 내 코드

function slide(){ 
    slideTimer = setInterval(function(){ 
     changeSlide(slideNumber); 
     slideNumber++; 
     if(slideNumber===5)slideNumber=0; 
    },4000); 
} 

slide(); 

$('#hoverElement').mouseenter(function(){ 
    clearInterval(slideTimer); 
    console.log('mouseenter'); 
}); 
$('#hoverElement').mouseleave(function(){ 
    slide(); 
    console.log('mouseleave'); 
}); 

대부분이 동일하고 나던 mouseenter의 간격을 정지 작업 나던. 나는 전에 당신의 코드를 시험해 보았고 어느 쪽도 효과가 없었다.

Answer 1

그냥 시작하고 호버에 간격을 취소 :

var timer, slideNumber = 0; 

function slide() { 
    timer = setInterval(function(){ 
     changeSlide(slideNumber); 
     slideNumber++; 
     if(slideNumber===5) slideNumber=0; 
    },4000); 
} 

function unslide() { 
    clearInterval(timer); 
} 

slide(); 

$('#hoverElement').on({ 
    mouseenter: unslide, 
    mouseleave: slide 
}); 

는 여기가 작동 보여줄 수있는 DEMONSTRATION입니다!