實例

div 元素滾動時執(zhí)行 JavaScript

 div onscroll= myFunction() 

定義和用法

onscroll 事件在元素滾動條在滾動時觸發(fā)。

提示： 使用 CSS overflow 樣式屬性來創(chuàng)建元素的滾動條。

瀏覽器支持

語法

HTML 中:

 element onscroll= myScript 

JavaScript 中:

object.onscroll=function(){myScript};

JavaScript 中, 使用 addEventListener() 方法:

object.addEventListener( scroll , myScript);

注意： Internet Explorer 8 及更早 IE 版本不支持 addEventListener() 方法。

Technical Details

技術(shù)細節(jié)

onscroll事件失效

 !DOCTYPE html  html  head  meta charset= utf-8  /head  body onscroll= checkscroll()  div >
大家可以將這段代碼copy親自測試一下，在有和沒有overflow屬性之間切換，就明白了。
因為很多同學在開發(fā)項目時，會有腳手架之類的文件進行快速開發(fā)，但是有的腳手架會在入口的html文件，設(shè)置overflow: scroll／auto。
這個屬性在入口級別的文件中最好不要隨意使用，造成的scroll滑動監(jiān)聽整體失效，你無論如何也不會想到是這個原因。
打個比方：
APP.vue
這是用vue.js寫的頁面，我在其中用了vux（一個基于vuejs的移動組件庫）的一個組件view-box,當時我找遍了所有的文件，并沒有那里
有over-flow 樣式；但是scroll事件失效，window.scrollY一直為0， 最后我發(fā)現(xiàn)所有頁面都是如此，于是我就定位在入口的幾個文件，將
相關(guān)的引入組件也進行排查，終于在view-box,這個組建里找到了over-flow：auto；樣式。注釋掉后，就正常了
所以說：over-flow：auto；如果放在入口文件并且放在包裹的父元素上，一定要慎重！
以上就是html5中在元素滾動條在滾動時觸發(fā)的事件onscroll的詳細內(nèi)容，其它編程語言        
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯(lián)系我們修改或刪除，多謝。