Javatpoint Logo
Javatpoint Logo

jQuery scroll() method

The scroll() method is used to trigger the scroll event or attach a function to run when scrolling occurs.

The scroll event occurs when a scrollbar is used for an element. The event is triggered when the user moves the scrollbar up or down. We can use the CSS overflow property for creating a scrollbar. The scroll event fires for window objects or for all scrollable elements.


We can either simply use the scroll() method or can add a function to the scroll event. The syntax of using the scroll() method is given as follows -

Trigger the event for the selected elements

Attach a function

The selector in the above syntax is the selected element. The parameter function mentioned in the above syntax is optional. It is a function to execute when the scroll event occurs. The attached function performs a specific task on scrolling.

Let's see an illustration of using the scroll() method.


It is a simple example of using the scroll() method. Here, there is a paragraph element with id = "para" on which we are applying the scroll() method. On scrolling the paragraph, the function attached to the scroll() method will trigger and will change the color and the background color of the corresponding paragraph. Here, we are using the optional parameter of the scroll() method.

Test it Now


jQuery scroll() method

After scrolling the bordered text on the screen, we will get the following output -

jQuery scroll() method

Youtube For Videos Join Our Youtube Channel: Join Now


Help Others, Please Share

facebook twitter pinterest

Learn Latest Tutorials


Trending Technologies

B.Tech / MCA