js隐藏与显示回到顶部按钮及window.onscroll事件应用

时间:2013-01-25    点击:390   
现在大多数网站都会添加这种功能:当滚动条滚动到页面的下方时,页面的右下角会显示出来一个“回到顶部”的按钮或连接,点击该按钮后页面会跳转到顶部,或某一个适合查看内容的位置。

那么,如何控制“回到顶部”按钮的显示或隐藏呢?其实我们只需要实现window.onscroll 事件即可,代码如下:
复制代码 代码如下:

window.onscroll = function () {
if (document.documentElement.scrollTop + document.body.scrollTop > 100) {
document.getElementById("scrollto").style.display = "block";
}
else {
document.getElementById("scrollto").style.display = "none";
}
}

scrollto 为页面上“回到顶部”的容器(div标签)
JavaScript转换农历类实现及调用方法
jQuery ajax serialize()方法的使用以及常见问题解决
js中parseFloat(参数1,参数2)定义和用法及注意事项
Js 冒泡事件阻止实现代码
如何让easyui gridview 宽度自适应窗口改变及fitColumns应用
> 返回     
地址:上海市普陀区胶州路941号长久商务中心 电话: QQ:
© Copyright 2012 上海网络 Product All Rights Reserved