前言：今天想写个页面常用到的【点击回到页面顶部或是首页的功能】，生活和职场一样，总会有低谷的时候，这个时候咱也别怂、别怂、别怂，说三遍！那都不是事，工作没了，再找呗，就像我上周五，团队解散那天，我是笑着走的，还给小白挥了挥手，微笑一个。那句话叫什么来着，佛祖虽给你关了一扇门，说不定会再给你开一扇窗。明天我就换工作了，我感谢我的同学。

a)下面看看实现，实现很简单，通过JQ判断滚动条向下滚动的长度大于多少时显示【回到顶部+回到首页】的图标（换一种理解：滚动条顶端距离页面顶部的距离），另外一种实现方法，就是通过锚标记，很好理解，就是标记一个位置，事件激活时，给我回到这个位置

b)JQ判断滚动条向下滚动的长度大于多少时，这个方法，也可以用来做页面的自动加载...就是你不停滚动，数据就不停加载...用户体验很好的喔【有时间就写】

 

1）首先我们写好DOM结构、写好CSS样式表

1 /* HTML */2 
     
      3       
      4      
      
5      
      
       6           
       7           
       8      
      
9 
     

1 /* CSS */ 2 　　　　　　.top_sec { 3                 position: fixed; 4                 bottom: 74px; 5                 right: 12px; 6                 width: 42px; 7                 z-index: 999; 8                 display: none; 9             }10             11             #goPageTop {12                 width: 42px;13                 height: 42px;14                 margin-bottom: 10px;15                 border-radius: 50%;16                 background: url(img/go_top_icon.png) no-repeat 0 0;17                 background-size: 42px auto;18                 display: block;19             }20             21             #goPageHome {22                 width: 42px;23                 height: 42px;24                 position: relative;25                 border-radius: 50%;26                 background: url(img/go_home_icon.png) no-repeat 0 0;27                 background-size: 42px auto;28                 display: block;29             }

 

2）来看看实现代码

1    

 

3）这是效果图

 

总结：一定注意是否引用了JQ类库。我觉得我写的东西都很简单，也许根本就没必要写，但是，一个学习前端开发的过程，我有必要用文字记录一下这个过程，渐渐地，这个过程会记录更多的东西。明天又是新的一天，我的新工作...