마우스를 올려 놓은 요소 밖에서 마우스 스크롤을 방지하는 방법은 무엇입니까?

Question

div가 overflow : scroll;으로 설정되어 있습니다. 나는 원하는대로 스크롤바를 얻는다. 그러나 마우스 휠을 사용하여 div를 스크롤 할 때 div의 내용의 상단이나 하단에 도달하면 페이지의 나머지 부분을 스크롤합니다.

어떻게 둘러 볼지에 따라 div 또는 전체 페이지 만 스크롤 할 수 있습니까?

Answer 1

먼저 스크롤 이벤트를 무시할 수 있다고 생각하지 않습니다. 그래서 여기에 제가 할 일이 있습니다. 나는 jquery 모르지만 여기에 몇 가지 직선 자바 스크립트입니다.

document.getElementById('scrollDiv').onmouseover=function(){ 
    document.getElementByTagName('body')[0].style.overflow='hidden'; 
} 
document.getElementById('scrollDiv').onmouseout=function(){ 
    document.getElementByTagName('body')[0].style.overflow=''; 
} 

분명히 약간 조정할 수 있지만 이는 기본적인 아이디어입니다. 또한 필요한 경우 다른 테스트 케이스를 수행 할 수 있습니다. div에 초점이있는 것처럼 똑같은 일을하십시오. 설정에 따라 다릅니다.

Answer 2

이 경우 본체의 기본 onscroll 이벤트를 재정의해야한다고 생각합니다. 핸들러에서 div의 내용을 수동으로 스크롤해야합니다.

Answer 3

마우스가 div의 범위 내에 있으면 마우스 위치를 테스트하고 문서의 스크롤 이벤트를 취소 할 수 있습니다.