需求:
1.当页面下滑距离顶端100px时,显示 button 按钮;
2.点击按钮,页面滑动动画出发,滑动到顶端,button 按钮消失。
/**
* top是按钮
* html省略
* 借助 jQuery
* */
$('#top').on('click',function () {
$("html, body").animate({scrollTop: 0 }, {duration: 500,easing: "swing"});
return false;
});
//绑定页面滚动事件
$(window).bind('scroll',function(){
var len=$(this).scrollTop();
console.log(len);
if(len>=100){
//显示回到顶部按钮
$('#top').fadeIn('1000');
}else{
//影藏回到顶部按钮
$('#top').fadeOut('1000');
}
});