实现功能:
- 页面滚动某个地方就显示,否则隐藏
 - 点击可以返回顶部
 
下面详细地说明具体的实现步骤:
① 滚动到某个地方后显示
② 事件:使用scroll页面滚动事件
③ 如果被卷去的头部(window.pageYOffset)大于某个数值
④ 点击返回顶部的图片,使用window.scroll(0, 0)返回顶部
/* 返回顶部模块CSS样式 */
.goBack {
    display: none;
    position: fixed;
    bottom: 50px;
    right: 20px;
    width: 38px;
    height: 38px;
    background: url(../images/back.png) no-repeat;
    background-size: 38px 38px;
}<!-- 返回顶部模块 -->
<div class="goBack"></div>
<!-- 顶部搜索模块 start -->
<script>
    // 返回顶部模块制作
    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 = 'none';
        }
    });
    goBack.addEventListener('click', function() {
        window.scroll(0, 0);
    });
</script><!-- 返回顶部模块 -->
<div class="goBack">
</div>
<!-- 顶部搜索模块 start --><script>    
// 返回顶部模块制作 
   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 = 'none';    
   }    });    goBack.addEventListener('click', function() {        window.scroll(0, 0);    });</script>










