2 demos to learn jQuery scroll in 15 minutes

How to use the jQuery scroll method?

The scroll event happens when a browser window is scrolled. Scroll event also occurs when scrollable elements like textarea is scrolled. As scroll event occurs, scroll() method of jQuery is used to perform desired actions.

Syntax of using the scroll method

$(selector).scroll(function)

Where selector can be a window or scrollable HTML element.

An example of scroll event

The following example shows how scroll event is captured and alert is shown when the browser window is scrolled.

Fill appropriate text to bring scroll bars in your testing HTML page in paragraphs.

jQuery scroll event

Experience this example online

Example with a textarea

In this example, the scroll jQuery method is used with the textarea. For the demo purpose, we filled the text area and kept the size smaller so that the scroll bar appears. As you scroll down or up in text area, the alert will display. The alert code is placed inside the scroll method:

jQuery scroll textarea

Experience this example online

Read also: jQuery scroll to element