JS简单实现DIV相对于浏览器固定位置不变的方法_Javascript教程-查字典教程网
JS简单实现DIV相对于浏览器固定位置不变的方法
JS简单实现DIV相对于浏览器固定位置不变的方法
发布时间:2016-12-30 来源:查字典编辑
摘要:本文实例讲述了JS简单实现DIV相对于浏览器固定位置不变的方法。分享给大家供大家参考,具体如下:AnchorPropertiesfuncti...

本文实例讲述了JS简单实现DIV相对于浏览器固定位置不变的方法。分享给大家供大家参考,具体如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > <html> <head> <title>Anchor Properties</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta content="noindex, nofollow" name="robots"> <script> function Totop(){ window.scrollTo(0,0); } function bottom(){ //scrollHeight属性是获取对象的滚动高度。 window.scrollTo(0,document.body.scrollHeight); } function left(){ //alert("left");alert(document.body.scrollLeft) var left = 0-document.body.scrollWidth;//向左移动的像素 window.scrollBy(left,0 ); } function right(){ //alert(document.body.scrollWidth); //整个滚动条的宽度 window.scrollBy(document.body.scrollWidth,0); } function init(){ var init_pos=oLayer.style.posTop ; var init_left=oLayer.style.posLeft; document.body.onscroll=function(){ //document.body.scrollTop等于滚动滑块上端离滚动的开始点的距离 oLayer.style.posTop=document.body.scrollTop+init_pos; //scrollLeft设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 oLayer.style.posLeft=document.body.scrollLeft +init_left; } } </script> </head> <body onload="init()"> <a>置底</a> <div id="oLayer"> ddddd </div> <br> <a>置右</a> <div>width="2000px"</div> <a>置左</a> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><a>置顶</a> </body> </html>

希望本文所述对大家JavaScript程序设计有所帮助。

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类