Home > Article > Web Front-end > In JavaScript, what is the purpose of onscroll event?

In JavaScript, what is the purpose of onscroll event?

PHPzforward: 2023-08-29 14:09:021324browse

When the element's scroll bar is scrolled, the onscroll event is triggered. You can try running the following code to learn how to implement the onscroll event in JavaScript.

Example

<!DOCTYPE html>
<html>
   <head>
      <style>
         div {
            border: 2px solid blue;
            width: 300px;
            height: 100px;
            overflow: scroll;
         }
      </style>
   </head>
   
   <body>
      <div id="content">
         This is demo text. This is demo text.This is demo text.This is demo text.
         This is demo text.This is demo text.This is demo text.This is demo text.
         This is demo text.This is demo text.This is demo text.
         This is demo text.This is demo text.This is demo text.
         This is demo text.This is demo text.This is demo text.
      </div>
      <p id = "myScroll"> </p>
      <script>
         document.getElementById("content").onscroll = function() {myFunction()};
         function myFunction() {
            document.getElementById("myScroll").innerHTML = "Scroll successfull!.";
         }
      </script>
   </body>
</html>

The above is the detailed content of In JavaScript, what is the purpose of onscroll event?. For more information, please follow other related articles on the PHP Chinese website!

Statement：

This article is reproduced at:tutorialspoint.com. If there is any infringement, please contact admin@php.cn delete

Previous article：How to write html search box codeNext article：How to write html search box code

See more

In JavaScript, what is the purpose of onscroll event?

Example

Related articles