<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事件的觸發,將其注釋掉之后,上面的代碼正常運行。