网页回到顶部实现方法

js获取页面元素距离浏览器工作区顶端的距离

网页被卷起来的高度/宽度(即浏览器滚动条滚动后隐藏的页面内容高度)

(javascript)document.documentElement.scrollTop//firefox

(javascript)document.documentElement.scrollLeft//firefox

(javascript)document.body.scrollTop //IE

(javascript)document.body.scrollLeft //IE

(jqurey)$(window).scrollTop()

(jqurey)$(window).scrollLeft()


网页实时滚动的方法

$(window).scroll()

这里是实时控制回到顶部按钮显示隐藏的事件

$(window).scroll(function () {

if ($(window).scrollTop() >500) {

$('#gotoTop').css('display','block');

}else{

$('#gotoTop').css('display','none');

}

});

这里是回到顶部按钮点击事件

$('#gotoTop').click(function () {

$('body,html').animate({scrollTop:0},1000);

return false;

});


当然还有锚点的方法 但直接跳转太过僵硬。



你可能感兴趣的:(网页回到顶部实现方法)