scroll() Method - Javascript jQuery Method and Property

Javascript examples for jQuery Method and Property:scroll

  1. HOME
  2. Javascript
  3. jQuery Method and Property
  4. scroll

Description

The scroll() method triggers the scroll event, or sets function as scroll event handler.

Syntax

Parameter Require Description
function Optional. function to run when the scroll event is triggered

The following code shows how to Count the number of times the scroll is used for an element:

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
x = 0;//from ww  w  .  j a v a 2s.  c o  m
$(document).ready(function(){
    $("div").scroll(function(){
        $("span").text( x+= 1);
    });
});
</script>
</head>
<body>

<p>Try the scrollbar in the div</p>

<div style="border:1px solid black;width:200px;height:100px;overflow:scroll;">
This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test.
<br><br>
This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test.
<br><br>
This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test.
<br><br>

</div>

<p>Scrolled <span>0</span> times.</p>

</body>
</html>

Related Tutorials