javascript 함수를 여러 번 실행 onmouseover

버튼을 가져갈 때 상자를 움직이는 함수가 있습니다. 마우스가 버튼 위로 움직이는 한, 매초마다 반복적으로 실행하는 기능을 원합니다. 나는 루프도 시도했지만 이것을 작동시킬 수는 없다. 나는 당신이 이것을 들여다 볼 수 있다면 매우 감사 할 것입니다.javascript 함수를 여러 번 실행 onmouseover

<!DOCTYPE html> 
<head> 
<style> 
#box { 
    position: relative; 
    top: 20px; 
    left: 10px; 
    width: 50px; 
    height: 50px; 
    background:#333366; 
} 
</style> 

<script> 
function Start() { 

setInterval(Move('box'),1000); 

} 

var value = 0; 
function Move(element) { 

    value += 50;  
    var box = document.getElementById(element); 
    box.style.transition = "left 0.2s ease-in-out 0s"; 
    box.style.left = value+'px';  

} 
</script> 
</head> 
<body> 
<button onmouseover="Start();">Hover to move</button> 
<div id="box"></div> 
</body> 
</html>

출처

2013-06-19 Arvid93

당신이 원하는 결과와 당신이로 실행 중이거나 사람들이 당신에게 당신이 정말로 찾고있는 대답을하지 않을 수 있습니다 실제 문제를 설명해야한다. – Shaded

사용이 :

setInterval(function(){ 
    Move('box') 
},1000);

당신은이 setInterval을에 함수를 전달하는 다음은 내 코드입니다. 실제로 Move를 호출하고 반환 값을 전달했습니다. 이 라인

setInterval(Move('box'),1000);

실행

출처

2013-06-19 16:19:04 bfavaretto

답장을 보내 주셔서 감사합니다. 문제가 해결되었습니다. – Arvid93

, Move('box') 평가 (하나의 실행)되고, 따라서 setInterval로 인수가의 반환 값은, 그 같은 null

출처

2013-06-19 16:21:38

설명해 주셔서 감사합니다. – Arvid93

뭔가 어쩌면 ?

http://jsfiddle.net/blackjim/HwKb3/1/

var value = 0, 
    timer, 
    btn = document.getElementById('btn'); 

btn.onmouseover = function(){ 
    timer = setInterval(function(){ 
     // your loop code here 
     Move('box'); 
    }, 1000); 
}; 

btn.onmouseout = function(){ 
    clearInterval(timer); 
} 

function Move(element) { 

    value += 50; 
    var box = document.getElementById(element); 
    box.style.transition = "left 0.2s ease-in-out 0s"; 
    box.style.left = value + 'px'; 

}

시도

는 처음에 당신을 도울 수, jQuery를 볼 수 있습니다.

출처

2013-06-19 16:26:51 AntouanK

답장을 보내 주셔서 감사합니다. 네가 박스에서 멈추는 방법을 보여 주니 좋았어. 버튼을 쥐고있을 때 상자가 계속 움직 였음을 알았 기 때문이다. – Arvid93

이 시도 :

var value = 0; 
function move(element) { 
    value += 50; 
    var box = document.getElementById(element); 
    box.style.transition = "left 0.2s ease-in-out 0s"; 
    box.style.left = value+'px'; 
    // console.log(box); 
} 

var button = document.getElementById("buttonID"); 
button.onmouseover = function() { 
    this.iid = setInterval(function() { 
     move("boxID"); 
    }, 1000); 
}; 

button.onmouseout = function() { 
    this.iid && clearInterval(this.iid); 
};

출처

2013-06-19 16:56:38 sarink

답변 해 주셔서 감사합니다. 아직 jQuery에 익숙하지 않습니다. – Arvid93

나는 그것을 당신을 위해 편집했다. – sarink

javascript 함수를 여러 번 실행 onmouseover

답변

관련 문제