마우스가 멈췄을 때를 감지하는 방법

다음 JavaScript 코드를 작성했습니다. 마우스를 움직이거나 멈출 때를 감지하는 데 사용하고 있습니다. MouseStopped() 함수는 마우스가 멈춘 곳을 알려주는 수백 가지 항목의 루프이므로 마우스가 멈췄을 때만 호출하고 싶습니다. 지금은 다음과 같은 문제가마우스가 멈췄을 때를 감지하는 방법

var CheckMovement; 
var stopLoop = false; 
var n = 0; 
canvas.addEventListener('mousemove', function (evt) { 
    CheckMovement = setInterval(function() { HasMouseStopped(evt) }, 250); 
}, false) 

function HasMouseStopped(evt) { 
    var mousePos = getMousePos(canvas, evt); 
    newMouseX = mousePos.x; 
    newMouseY = mousePos.y; 
     if ((newMouseX !== mouseX) && (newMouseY !== mouseY)) { 

      stopLoop = true; 
     } else { 
      //stopped moving 
      clearInterval(CheckMovement); 
      stopLoop = false; 
      n = 0; 
      MouseStopped(); 
     } 
     mouseX = newMouseX; 
     mouseY = mousePos.y; 
} 

function MouseStopped() { 
    while (arr.length > n) { 
     if (stopLoop) { break; } 
     if (ctx.isPointInPath(mouseX, mouseY)) { 
      //tooltip text 
      ctx.font = '12pt Candara'; 
      ctx.fillStyle = 'black'; 
      ctx.fillText(arr[n], mouseX + 10, mouseY - 5); 
      break; 
     } 
     n++; 
    } 
}

: 나는 clearInterval(CheckMovement)를 호출하고 있지만

를, 그렇지 반복하는 정지를하지; 계속 실행 중이므로 번을 MouseStopped() 번으로 호출하는 문제가 발생합니다. 왜 멈추지 않습니까?
루프를 완료하기 전에 마우스를 움직이면 조작 중간에 MouseStopped()을 중단하고 싶습니다. 이것이 내가 설정하는 이유입니다 stopLoop = true; 그러나 의도 한대로 작동하지 않는 것 같습니다. 어떻게하면됩니까?

감사합니다.

편집

출처

2013-07-15 Hannington Mambo

루프가 실행되는 동안 참으로 설정할 수없는 루프 안에 테스트가 있습니다. 'while (arr.length> n) {if (stopLoop) {break; }'- mouseStopped는 인터럽트 가능하도록 setTimeout 또는 interval을 사용해야합니다. – mplungjan

먼저 마우스가 정지 된 것으로 간주되는 시점을 정의하십시오. 3 초 동안 비활성 상태입니까, 아니면 3 밀리 초 동안 다른 것보다 훨씬 더 많이 충돌합니다. 둘째, 마우스 이동시 간격 기능을 설정하고 일치 할 때까지 이전 및 현재 마우스 위치를 비교하고 간격 기능을 중지하십시오 –

setTimeout을 대신 사용하십시오 –

정말 간단합니다 : 마우스가 이동할 때, 미래의 XXX 밀리 초 동안 제한 시간을 설정합니다. 또한 이전 시간 초과를 지우면 시간이 재설정됩니다. 이 같은 MouseMove 이벤트 리스너

clearTimeout(timer); 
timer=setTimeout(mouseStopped,300);

이 JSFiddle를 참조하십시오.

출처

2013-10-09 03:22:28

우아한 솔루션. – jhc

마우스가 멈췄을 때를 감지하는 방법

답변

관련 문제