이미지가있는 setInterval에서 onmouseover 및 onmouseout 이벤트로 if else 함수를 설정하는 방법은 무엇입니까?

Question

var myImage = document.getElementById("mainImage"); 

var imageArray = ["_images/1.jpg","_images/2.jpg","_images/3.jpg", 
        "_images/4.jpg","_images/5.jpg","_images/6.jpg"]; 

var imageIndex = 0; 

function changeImage() { 
    myImage.setAttribute("src", imageArray[imageIndex]); 
    imageIndex++; 
    if (imageIndex >= imageArray.length) { 
     imageIndex = 0; 
    } 
} 

난 당신 onmouseover는,이 중지됩니다 때, 다음 onmouseout, 다시 및 재시작 gif처럼 변화하는 이미지를 얻는 방법을 JS에 근본적인 배우는 중이에요. 나는 아래 부분에서 고투하고있다.

var intervalHandler = setInterval(changeImage, 3000); 

myImage.onmouseover = function(){ 
    clearInterval(intervalHandler); 
} 

myImage.onmouseout = function(){ 
    setInterval(changeImage, 3000); 
} 

Answer 1

여기에 예제가 있습니까?

http://www.w3schools.com/jsref/met_win_cleartimeout.asp이 제대로 수행합니다

Btw는

function clearInterval(timeout, period){ 
    return clearTimeout(callback,period); 
} 

function myStopFunction(timeout) { 
    clearTimeout(timeout); 
} 

하는 무기한 실행하려는 당신이 루프를 만들기 위해 :

//Start initially: 
var intervalHandler = setTimeout(changeImage, 3000); 

myImage.onmouseover = function(){ 
    clearInterval(intervalHandler); 
} 

myImage.onmouseout = function(){ 
    //reset the variable, so it has the new timeout. 
    intervalHandler = setInterval(changeImage, 3000); 
} 

는 setInterval을 함수가 타임 아웃을 반환해야합니다

intervalHandler = setTimeout(changeImage, 3000); 

changeImage 함수 끝 부분에

입니다.