자바 스크립트 setinterval 및 clearinterval

Question

나는 이미지가 떨어지는 것처럼 보이도록하려고합니다. 그래서 div를 만들어 이미지를 넣었습니다. setinterval과 clearinterval 사용하기 나는 div의 경계에서 멈출 이미지를 얻으려고하는데, 어떻게해야할지 모르겠다.

var x = 200; 
var y = -155; 
var inc = 5; 

var myVar; 

var fall = function() { 
myVar = setInterval(function(){moveDown();},30); 
}; 
var stopFall = function() { 
clearInterval(myVar); 
}; 
var moveDown = function() { 
y += inc; 

document.getElementById('img1').style.top = y + 'px'; 
}; 

내가 y = 155는하지만 방법을 모르는 경우 setinterval가 자동으로 중지하려면 : 여기에 코드입니다. while, for 문을 시도했지만 작동하지 않는 것 같습니다. stopFall();을 실행하는 버튼을 만들었지 만 작동하지만 버튼을 클릭하지 않고 자동으로 멈추고 싶습니다. 누구든지이 작업을 수행하는 방법을 알고 있습니까?

Answer 1

moveDown() 기능을 변경하여 현재 상태 인 y을 확인하고 필요한 경우 stopFall()으로 전화하십시오. 당신이 직접이

var moveDown = function() { 
    y += inc; 

    if (y >= 155) { 
    clearInterval(myVar); 
    } 

    document.getElementById('img1').style.top = y + 'px'; 
}; 

Answer 2

var x = 200; 
var y = -155; 
var inc = 5; 

var myVar; 

var fall = function() { 
     myVar = setInterval(function(){ 
     if(y >= 155) clearInterval(myVar); 
     moveDown(); 
     }, 
     30); 
}; 

var moveDown = function() { 
    y += inc; 

    document.getElementById('img1').style.top = y + 'px'; 
};