HTML事件屬性onscroll

2018-01-05 13:58 更新

HTML事件屬性onscroll


觸發(fā) onscroll 屬性事件當(dāng)元素的滾動(dòng)條正在滾動(dòng)時(shí)。

HTML5中的新功能

onscroll 屬性是HTML5中的新特性。

句法

<element onscroll="script or Javascript function name">

支持的標(biāo)簽

<address>, 
<blockquote>, 
<body>, 
<caption>, 
<center>, 
<dd>, 
<dir>, 
<div>, 
<dl>, 
<dt>, 
<fieldset>, 
<form>, 
<h1> to <h6>, 
<html>, 
<li>, 
<menu>, 
<object>, 
<ol>, 
<p>, 
<pre>, 
<select>, 
<tbody>, 
<textarea>, 
<tfoot>, 
<thead>, 
<ul>


瀏覽器兼容性

onscroll Yes Yes Yes Yes Yes

例子

<!DOCTYPE html>
<html>
<head>
<style>
#myDIV {
    border: 1px solid black;
    width: 200px;
    height: 100px;
    overflow: scroll;
}
</style>
</head>
<body>

<div id="myDIV" onscroll="myFunction()">
This is a test. This is a test. This is a test. This is a test. This is a test. 
This is a test. This is a test. This is a test. This is a test. This is a test. 
This is a test. This is a test. This is a test. This is a test. This is a test. 
This is a test. This is a test. This is a test. This is a test. This is a test. 
This is a test. This is a test. This is a test. This is a test. This is a test. 
This is a test. This is a test. This is a test. This is a test. This is a test. 
This is a test. This is a test. This is a test. This is a test. This is a test. 
</div>

<script>
function myFunction() {
    console.log("scrolled");
}
</script>

</body>
</html>

Click to view the demo



以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)