您的位置：首页 > Web前端 > JavaScript

保持滚动条位置

2011-08-14 23:10 176 查看

为了做到这个功能，我们需要做两件事情，第一，滚动条发生改变的时候记录滚动条位置。把它保存在hidden <input> field 第二，当网页回发时，hidden <input> field 的值会发送到服务器端，服务器告诉客户端重新设置滚动条位置。首先来看看javascript是怎么记录滚动条位置的。

<script language = "javascript">
<!--
function sstchur_SmartScroller_GetCoords()  //记录滚动条位置
{
var scrollX, scrollY; 保存滚动条的水平位置和垂直 位置

if (document.all)   //IE浏览器
{
if (!document.documentElement.scrollLeft)
scrollX = document.body.scrollLeft;
else
scrollX = document.documentElement.scrollLeft;

if (!document.documentElement.scrollTop)
scrollY = document.body.scrollTop;
else
scrollY = document.documentElement.scrollTop;
}
else  //其他浏览器
{
scrollX = window.pageXOffset;
scrollY = window.pageYOffset;
}

document.forms[formID].xCoordHolder.value = scrollX;
document.forms[formID].yCoordHolder.value = scrollY;
}

function sstchur_SmartScroller_Scroll()  //重新设置滚动条
{
var x = document.forms[formID].xCoordHolder.value;
var y = document.formsformID].yCoordHolder.value;
window.scrollTo(x, y);
}

window.onload = sstchur_SmartScroller_Scroll;
window.onscroll = sstchur_SmartScroller_GetCoords;
window.onkeypress = sstchur_SmartScroller_GetCoords;
window.onclick = sstchur_SmartScroller_GetCoords;
// -->
<script>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： javascript scroll function 浏览器 input 服务器

相关文章推荐

新的分享

章节导航