jQuery 마우스를 올리면 화면 이동 간격이 취소됩니다.

Question

죄송합니다. 예제가 없습니다.

그러나 스크롤 상자 (왼쪽 및 오른쪽 스크롤)를 만들고 있습니다. 두 개의 이미지에 바인드 mouseDown 기능이 있습니다.이 두 가지 이미지는 상자를 스크롤하는 데 사용됩니다. 함수는 "scrollLeft()"및 "scrollRight()"입니다.

이 기능은 계획대로 작동합니다 (상자를 왼쪽 및 오른쪽으로 이동). 그러나 mouseUp 이벤트에 문제가 있습니다. 마우스를 이미지 위에 올리면 스크롤 이벤트가 취소되어 스크롤이 중지됩니다.

그러나 이미지와 마우스를 떼어 내면 스크롤러는 계속 기능을 수행합니다.

내가 jQuery를 사용하고 있는데

$("*").mouseup(function(){ 
    console.log("ouseup"); 
    clearInterval(interval); 
}); 

이 중 하나가 작동하지 않습니다 포함한 모든 종류의 것들을 시도했습니다. 나는 mouseup이 트리거 될 때 "간격"간격을 제거하려고합니다.

제안 사항?

Answer 1

mouseout() 이벤트를 사용하는 것이 가장 좋을 것 같은데요. 마우스를 놓으면 화재가 발생하도록 이미지에 바인딩하십시오.

편집 : 좋아, 마우스를 놓으면 이미지가 사라지고 mouseup 이벤트가 발생합니다. 따라서 triggerHandler() 기능을 활용하고 싶습니다.

$('#myImage').mouseout(function(){ 
    $('#myImage').triggerHandler('mouseup'); 
}); 

또는 (이미 제안), 몸 전체에 MouseUp 이벤트를 바인딩 또한 옵션이 될 수 :

$('body').mouseup(function(){ 
    ClearInterval(); 
}); 

멀리 마우스를 이동할 때 MouseUp 이벤트가 발사되지 않은 이유 버튼을 놓기 전에 이미지에서 마우스 버튼이 다른 요소의 'up'이벤트를 발생시키는 것입니다.. 마우스 업 이벤트는 마우스가 그 시점에 위치하게되는 요소에 대해 트리거된다는 것을 기억하십시오. 따라서 마우스 버튼을 한 곳에서 누른 다음 mouseup 이벤트를 예상하는 영역에서 멀리 이동하면 마우스 버튼을 다시 눌렀다는 것을 알 수 없습니다.

Answer 2

당신은 문서 MouseUp 이벤트에 대한 핸들러를 첨부 할 수있는, 즉

$(document.body).mouseup(function() { 
    console.log("ouseup"); 
    clearInterval(interval); 
}); 

당신이 클릭 된 마우스 버튼으로 장소를 떠났다가이 방법, 당신이 그것을 해제 할 때까지 계속 스크롤됩니다.