div 서비스 onscroll

Question

div 요소에 onscroll 이벤트 핸들러가 없습니까? 내 페이지의 동작이 onscroll 이벤트 처리기가 인식되었음을 나타내지 않습니다. 또한

<div id='bd' onscroll='alert("Scroll Called");'></div> 

,
는 DIV 스크롤 이벤트가 버블 링 DOM 이벤트에 따라, 윈도우 스크롤 이벤트를 롤업합니까?

Answer 1

예. 요소에는 스크롤바가 있어야합니다. overflow: auto (콘텐츠가 충분히 크면 스크롤바가 표시됨) 또는 overflow: scroll 중 하나로 지정할 수 있습니다. 사업부는 윈도우 스크롤 시작합니다 아래로 스크롤 된 후 그들은 거품을하지 않지만

(이들은 ...뿐만 아니라 overflow-y: scroll X & y를 위해 특별히 설정할 수 있습니다). (사업부가 스크롤 할 수 있습니다 기본적으로 경우 스크롤 이벤트를 가로 챌하지만 다음 페이지로 이동합니다 수없는 경우 것)

Answer 2

을 나는 그것이 당신이 찾고있는 정확하게하지 않을 수 있습니다 알고 있지만, 많은의 자바 스크립트 프레임 워크가이를 도와 줄 수 있습니다. 스크롤 이벤트에 연결하기 위해 div가 스크롤바를 가질 필요는 없습니다.

예 : Mootools에는 mousewheel 이벤트가 있습니다. Demo here. (스크롤바가 있지만, 스크롤바를 제거하고 시도해도 파이어 버그를 사용할 수 있습니다 - 여전히 작동합니다).

나는 이걸 나에게 사용했다. site 나는 뒤로 물러났다. 이미지 위로 마우스를 가져 가면 스크롤하면 기본 페이지 스크롤을 방지하고 대신 이미지 막대를 슬라이드합니다.

Answer 3

사용중인 HTML 버전에 따라 onwheel 이벤트를 대신 사용할 수 있습니다.

onscroll 이벤트는 모두가 다음에 해당하는 경우에만 작동하십시오 사업부는 overflow: auto, overflow: scroll, overflow-y: scroll을 가지고

1. 등
2. 사업부는 현재 스크롤 할 수 보이는 스크롤바가 있습니다.
3. 마우스가 실제로 움직이면 스크롤 막대가 스크롤됩니다.

따라서 onscroll 이벤트는 일반적인 마우스 휠 이동을 감지하는 데 적합하지 않습니다.

onwheel 이벤트는 HTML 5의 새로운 기능입니다. According to w3schools, 꽤 널리 지원되고 있습니다.

Answer 4

나는 DOCTYPE 지시어에 대해 더 자세히 알기 전까지이 책에 대해서도 머리를 썼다. 최신 버전의 HTML 사양에서는 onscroll 속성이 지원되지 않습니다. Visual Studio에서 유효하지 않은 구문으로 표시됩니다. 많은 브라우저에서 작동하지만 잘못된 코드입니다.

대신 Javascript 또는 jQuery를 사용하여 이벤트를 처리 할 수 ​​있습니다. 이와 같은 접근 방식을 사용하여 두 개의 개별 div에서 스크롤을 동기화합니다.

$("#gridTableContainer").scroll(function() { 
    HandlingScrollingStuff(); 
}); 

Answer 5

JQUERY scroll()이 도움이 될 수 있습니다.

$("#gridTableContainer").scroll(function() { 
    HandlingScrollingStuff(); 
});