js 回到顶部效果

weixin_30411997

于 2017-05-30 17:47:00 发布

阅读量58

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/yaomengli/p/6920942.html

var ding=document.getElementById("top");
var top;
var timer=null;

window.onscroll=function () {
    top=document.documentElement.scrollTop||document.body.scrollTop;
    // alert(11);
    if(top>500){
        ding.style.display="block"
    }else{
        ding.style.display="none"
    }
};
ding.onclick=function () {
    timer=setInterval(function () {
       var speed=Math.floor(-top/6);
        top=document.documentElement.scrollTop||document.body.scrollTop;
        document.documentElement.scrollTop=document.body.scrollTop =top+speed; //滚动条距离顶部的距离每次减少50
            console.log(top);
        if(top==0){
            clearInterval(timer);
            //alert(11)
        }

    },30);

    //
}