JS實現表頭固定,左右滾動不固定


<script type="text/javascript">
window.onscroll=function(){
var sl=-Math.max(document.body.scrollLeft,document.documentElement.scrollLeft);
document.getElementById('a908').style.left=sl+'px';
}
</script>
</head>
<body>
<div id="a908" style="position:fixed;left:0px;top:0px;border:solid 1px #000;width:100%;background:#fff;overflow:auto;">
fixed定位容器
</div>

注意以上代碼有可能會失效,主要與父對象的overflow的值有關。

在做項目的時候我通過將項目中的某個頁面的源文件(如下圖的源文件)拷貝到.txt中,改后綴為.html打開驗證onscroll時間是否有效的方式定位錯誤。通過使引入的css文件失效/有效的方式定位是哪一個CSS文件中的overflow屬性影響到onscroll,然后再將CSS文件拷貝到剛才修改的.html文件中,發現是 .html .body{...overflow:hidden;...}這個屬性影響到了onscroll事件的觸發,將其注釋掉之后,上面的代碼正常運行。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM