一、引言

　　在web页面中，如果页面较高，为了方便用户快速地返回顶部，都会添加一个返回顶部按钮。例如：

　　其中淘宝网的是要滚动条的滚动距离大于某一段距离才显示返回顶部按钮；人人网的返回顶部直接在底部的工具条上；新浪微博的返回顶部在滚动高度大于0的时候显示，且返回顶部的效果是平滑动画效果。本文的实现就是类似于新浪微博的这种效果。//zxx:新浪微博今天启用新域名weibo.com了

　　二、jQuery下的返回顶部功能

　　可以看到，如果页面有滚动高度，右下角就会有一个含有返回顶部字样的黑色背景半透明的小条条，如下图所示：

　　点击这里返回顶部字样的按钮后，页面就像是抹了润滑剂一样，倏地一声就滑到顶部了，同时，该点击按钮也玩起了躲猫猫 – 不见了。

　　实现的原理嘛，恩……估计鲜有人关心，所以我也懒得浪费口水了，直接上代码。

　　无论是这里的jQuery实现还是MooTools实现，下面的CSS代码都是一致的，如下：

.backToTop {
    display: none;
    width: 18px;
    line-height: 1.2;
    padding: 5px 0;
    background-color: #000;
    color: #fff;
    font-size: 12px;
    text-align: center;
    position: fixed;
    _position: absolute;
    right: 10px;
    bottom: 100px;
    _bottom: "auto";
    cursor: pointer;
    opacity: .6;
    filter: Alpha(opacity=60);
}        

        

        
        
      
        
it知识库：仿新浪微博返回顶部的js实现(jQuery/MooTools)，转载需保留来源！
        
郑重声明：本文版权归原作者所有，转载文章仅为传播更多信息之目的，如作者信息标记有误，请第一时间联系我们修改或删除，多谢。