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

In JavaScript, what is the purpose of onscroll event?

PHPz
PHPzforward
2023-08-29 14:09:021333browse

In JavaScript, what is the purpose of onscroll event?

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