- <!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 top(){
- 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 oLayer = document.getElementById("BtnLeft") ;
var oLayer_R = document.getElementById("BtnRight");
//左边
var init_pos = oLayer.offsetTop;
var init_left = oLayer.offsetLeft;
//右边
var init_pos_R = oLayer_R.offsetTop;
window.onscroll = function () {
//document.body.scrollTop等于滚动滑块上端离滚动的开始点的距离
var heightTop = document.documentElement.scrollTop || document.body.scrollTop;
var left = document.documentElement.scrollLeft || document.body.scrollLeft;
oLayer.style.top = heightTop+ init_pos;
//scrollLeft设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
//oLayer.style.posLeft = left + init_left;
//document.body.scrollTop等于滚动滑块上端离滚动的开始点的距离
oLayer_R.style.top = heightTop + init_pos_R;
//scrollLeft设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
//oLayer_R.style.posLeft = document.body.scrollLeft + init_Left_R;
//alert(oLayer_R.style.posLeft);
} - }
- </script>
- </head>
- <body onload="init()">
- <a onclick="bottom()">置底</a>
- <div id="oLayer" style="position:absolute;left:120;top:60;z-index:2;background:green;width:120px;height:120px"> ddddd
- </div>
- <br>
- <a onclick="right()">置 右</a>
- <div style="width:1500px;height:30px;float:left">width="2000px"</div>
- <a style="float:right" onclick="left()">置 左</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 onclick="top()">置 顶</a>
- </body>
- </html>
原文地址:http://hbiao68.iteye.com/blog/1603621