The scroll event fires when the target element is scrolled.
Scripting scroll events through Javascript and the DOM:
Javascript CODE EXAMPLE
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function addEventsToHTML(){
var div1 = document.getElementById('div1');
div1.onscroll = scrollHandler;
function scrollHandler(){
alert("scroll event dispatched for "+this.id);
}
}
window.onload = addEventsToHTML;
</script>
</head>
<body>
<div id="div1" style="background:#C6E2FF; width:300px; height:200px; overflow-y:scroll;">
<p style="height:800px;">paragraph content</p>
</div>
</body>
</html>
Establishing scroll events direct on the html elements:
Javascript CODE EXAMPLE
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function scrollHandler(target){
alert("scroll event dispatched for "+target.id);
}
</script>
</head>
<body>
<div id="div1" onscroll="scrollHandler(this);" style="background:#C6E2FF; width:300px; height:200px; overflow-y:scroll;">
<p style="height:800px;">paragraph content</p>
</div>
</body>
</html>