作家
登录

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

作者: 来源:www.28hudong.com 2013-03-30 00:11:34 阅读 我要评论

现在大多数网站都会添加这种功能:当滚动条滚动到页面的下方时,页面的右下角会显示出来一个“回到顶部”的按钮或连接,点击该按钮后页面会跳转到顶部,或某一个适合查看内容的位置。 那么,如何控制“回到顶部”按钮的显示或隐藏呢?其实我们只需要实现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标签)

  推荐阅读

  S2SH整合JQuery+Ajax实现登录验证功能实现代码

不多说了,上码 action 复制代码 代码如下: package com.lk.action; import javax.annotation.Resource; import com.googlecode.jsonplugin.annotations.JSON; import com.lk.service.StudentControl; import com.>>>详细阅读


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

地址:http://www.17bianji.com/kaifa2/JS/22435.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)