最近在写一个当页面滚动到一定位置时,页面右下角出现一个 “返回顶部的按钮”,点击后返回页面最顶部位置。
一开始我是用jq的$("body").scrollTop()
计算混动距离,当距离大于一个值得时候,按钮出现show()
,当小于这个值得时候,按钮消失hide()
。当点击按钮的时候$("#gotop").on("click",function(){$("body").scrollTop(0)})
。
一开始在chrome
浏览器上是能正常运行的,但在firefox
运行的时候,按钮就不出现了。而且点击没有效果。通过控制台我发现,firefox
下,$("body").scrollTop()
的值永远为0.
这个是为什么呢?
原来火狐页面不支持document.body.scrollTop
的这种js写法,这样写的值会是0,jq的方法scrollTop()
的值也一直为0,就肯定不会出现按钮了。如果换成:document.documentElement.scrollTop
,这样能出现值了。
但是火狐不能通过设置document.documentElement.scrollTop
的值来使页面回到顶部。点击效果还是没有出现。我的解决方法是利用a标签href="#",点击会回到顶部的方式,使页面点击回到顶部。
如果有更好的解决方法,请跟我说一下哦~谢谢。
网友评论