js隐藏与显示回到顶部按钮及window.onscroll事件应用
来源:互联网 发布:协同过滤算法 spark 编辑:程序博客网 时间:2024/06/06 10:50
现在大多数网站都会添加这种功能:当滚动条滚动到页面的下方时,页面的右下角会显示出来一个“回到顶部”的按钮或连接,点击该按钮后页面会跳转到顶部,或某一个适合查看内容的位置。
那么,如何控制“回到顶部”按钮的显示或隐藏呢?其实我们只需要实现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";
}
}
0 0
- js隐藏与显示回到顶部按钮及window.onscroll事件应用
- js隐藏与显示回到顶部按钮
- 【JavaScript】利用滚动事件window.onscroll与position:fixed写兼容IE6的回到顶部组件
- 【JavaScript】利用滚动事件window.onscroll与position:fixed写兼容IE6的回到顶部组件
- JS回到顶部按钮
- JS实现回到顶部按钮
- js应用之事件触发:隐藏和显示按钮
- 鼠标滚动事件:回到顶部按钮
- JS 回到顶部与底部
- 百分百纯js实现回到顶部按钮
- js 回到顶部按钮小例子
- JS回到顶部按钮实现源代码
- js控制”回到顶部“按钮滚动一屏后再显示和滚动条平滑滚动
- js的window.onscroll事件兼容各大浏览器
- js的window.onscroll事件兼容各大浏览器!
- js的window.onscroll事件兼容各大浏览器!
- 回到顶部按钮
- 回到顶部按钮
- [真格邦]JAVA实战-三人斗地主
- 一句话解释java类型的强转
- Android 快速开发框架:推荐10个框架:afinal、ThinkAndroid、andBase、KJFrameForAndroid、SmartAndroid、dhroid..
- Android SwipeRefreshLayout 官方下拉刷新控件介绍
- 使用二分查找求解最长上升子序列
- js隐藏与显示回到顶部按钮及window.onscroll事件应用
- Android 热门搜索,自定义流式布局,自动换行,自动补齐
- 梯度消失,梯度爆炸
- Android实用技巧.视图技巧(一)
- Ubuntu--Jenkins中配置GIT仓库 以及出现配置git时not connection 解决办法 ---
- eval(expression, globals=None, locals=None)动态语言的特性(很棒)
- SVN 一次性提交多个目录中文件的方法
- dubbo 延迟暴露
- 测试Android Studio自动生成Demo(Basic Activity)