p{margin-bottom:30px;}.back{width:60px;高度:60px;行高:60px;文本对齐:居中;背景色:#abf;位置:固定;右:100px;底部:100px;cursor:pointer;}思路分析回到顶部效果,其实思路很简单。即开头有一个框,固定在浏览器网页的右下角,最开始应该是隐藏的。使其在滚动超过折叠高度以上的位置时出现。给这个小盒子绑定一个点击事件。在点击事件的回调中,使用一个定时器来降低滚动条的高度,从而达到回到顶部的效果。当然滚动事件也必须绑定监听滚动的高度,即监听滚动条纵坐标的位置。因为需要比较滚动条的滚动高度和首屏的高度。废话不多说,先来看看最终效果图:请按照注释附上代码返回顶部
返回