【兼容性解决】页面滚动距离document.documentElement.scrollTop兼容性问题-CFANZ编程社区

【兼容性解决】页面滚动距离document.documentElement.scrollTop兼容性问题

<!doctype html>

 <html>

 <head>

 <meta charset="utf-8">

 <meta name="author" content="前端工程师——和派孔明" />

 <meta name="copyright" content="前端工程师——和派孔明" />

 <title>页面滚动距离兼容性解决</title>

 <style>

 *{ margin:0; padding:0; list-style:none; font-family: "微软雅黑","张海山锐线体简"}

 body{height:2000px;}

 #div1{width:100px;height:101px;background:red; position:fixed;right:0;bottom:0;}

 </style>

 <script>



 if(window.navigator.userAgent.toLowerCase().indexOf('msie 6') != -1){

//ie6

window.οnlοad=function(){

var oDiv=document.getElementById('div1');

oDiv.style.position='absolute';
window.οnscrοll=window.οnresize=function(){
//document.body.scrollTop =>chrome
//document.documentElement.scrollTop =>IE 火狐 
var scrTop=document.documentElement.scrollTop || document.body.scrollTop;

var clientH=document.documentElement.clientHeight;

var divH=oDiv.offsetHeight;


oDiv.style.top=scrTop+clientH-divH+'px';
 

};

};
 

 }

 </script>

 </head>


 <body>


 <div id="div1"></div>


 </body>

 </html>

0 条评论