HTML onscroll属性用法及代码示例

当滚动元素滚动条时，此onscroll属性有效。要在元素中创建滚动条，请使用CSS溢出属性。

用法:

<element onscroll = "script">

属性：所有HTML元素均支持此属性，并且该属性在脚本触发时起作用。

例：

<!DOCTYPE html> 
<html> 
  
<head> 
    <title>onscroll attribute</title> 
    <style> 
        #gfg { 
            border:1px solid black; 
            width:400px; 
            height:100px; 
            overflow:scroll; 
            text-align:justify; 
        } 
          
        h1 { 
            color:green; 
        } 
    </style> 
</head> 
  
<body> 
  
    <h1>GeeksforGeeks</h1> 
    <h2>onscroll attribute</h2> 
  
    <div id="gfg" onscroll="Geeks()"> 
      <b>GeeksforGeeks:</b> 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("gfg").style.color = "green"; 
        } 
    </script> 
      
</body> 
  
</html>

输出：

支持的浏览器：下面列出了onscroll属性支持的浏览器：

谷歌浏览器
IE浏览器
Firefox
Opera
Safari

相关用法

注：本文由纯净天空筛选整理自ManasChhabra2大神的英文原创作品 HTML | onscroll Attribute。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。