02.返回顶部模块制作

需求

1.当页面滚动到某个地方，就显示，否则隐藏
2.点击可以返回顶部

案例分析

1.滚动某个地方显示
Ⅰ.事件：scroll页面滚动事件
Ⅱ.如果被卷去的头部大于某个数值
Ⅲ.点击，window.scroll(0,0) 返回顶部

//返回顶部模块制作
    var goBack = document.querySelector('.goBack');
    var nav = document.querySelector('nav');
    window.addEventListener('scroll',function(){
        if(window.pageYOffset >= nav.offsetTop){
            goBack.style.display = 'block';
        }else{
            goBack.style.display = '';
        }
    });
    goBack.addEventListener('touchstart',function(){
        //过渡效果的返回顶部
        var timer = setInterval(function(){
            document.documentElement.scrollTop -=50;
            if(document.documentElement.scrollTop <= 0){
                clearInterval(timer);
            }
        },10);
    });

.