jquery回到顶部
时间: 2023-11-14 11:00:38 浏览: 142
jquery返回顶部
jquery回到顶部的方法有多种实现方式。其中一种方法是在页面中添加一个返回顶部的按钮,通过点击按钮触发事件来实现回到页面顶部的效果。具体的代码如下:
```javascript
$(function () {
$(window).scroll(function () {
if ($(this).scrollTop() > 100) {
$('#back-to-top').fadeIn();
} else {
$('#back-to-top').fadeOut();
}
});
$('#back-to-top').click(function () {
$('body,html').animate({
scrollTop: 0
}, 800);
return false;
});
});
```
在这个代码中,我们首先监听窗口的滚动事件。当滚动条距离顶部大于100像素时,返回顶部按钮显示出来,否则隐藏起来。当点击返回顶部按钮时,页面会以800毫秒的动画效果滚动到顶部。
阅读全文