Tutorialspoint.dev

HTML | onscroll Attribute

This onscroll attribute works when an element scrollbar is being scrolled. To create a scrollbar in an element, use the CSS overflow property.

Syntax:

<element onscroll = "script">

Attribute: This attribute is supported by all HTML elements and the attribute works when script triggered.

Example:

<!DOCTYPE html>
<html>
    <head>
        <title>onscroll attribute</title>
        <style>
            #sudo {
                border: 1px solid black;
                width: 200px;
                height: 100px;
                overflow: scroll;
            }
            h1 {
                color:green;
            }
        </style>
    </head>
        <body>
            <center>
            <h1>GeeksforGeeks</h1>
            <h2>onscroll attribute</h2>
              
            <div id="sudo" onscroll="Geeks()">GeeksforGeeks: A computer
            science portal for geeks.It ia a good wqebsite for learning 
            computer science. It has a good programming Question and 
            have many Interwiew Experiences. Prepare for the Recruitment
            drive of product based companies like Microsoft, Amazon, 
            Adobe etc with a free online placement preparation course. 
            The course focuses on various MCQ's & Coding question likely
            to be asked in the interviews & make your upcoming placement
            season efficient and successful. 
            </div>
            <script>
                function Geeks() {
                    document.getElementById("sudo").style.color = "green";
                }
            </script>
            </center>
    </body>
</html>                            

Output:

Supported Browsers: The browser supported by onscroll attribute are listed below:

  • Apple Safari
  • Google Chrome
  • Firefox
  • Opera
  • Internet Explorer


This article is attributed to GeeksforGeeks.org

leave a comment

code

0 Comments

load comments

Subscribe to Our Newsletter