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。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。