jQuery返回顶部【简洁好用】

网页内容竖向超过一屏显示时，一般为了用户体验，会在页面的右边或者右下角显示一个返回顶部的按钮，以便浏览。
效果如下：

html页面

<div class="fanhuiTop">
        <a href="javascript:;" title="返回顶部" id="gototop" style="display: block;"><img src="*****/public/images/go_top.png" width="48" height="48"></a>
</div>

css样式

.fanhuiTop{
    min-height:48px;
    line-height:48px;
    padding:10px 0;
    bottom: 10px;right: 15px;
}
.fanhuiTop span{ 
    height:25px; 
    font-size:14px; 
    display:inline-block;
    float:left;
}
.fanhuiTop a{ 
    height:48px; 
    float:right;
}

jQuery

<script language="javascript">
    $(document).ready(function(e) {
        //垂直滚动时显示“返回顶部”
        $(window).scroll(function(e) {
            var scrolltop = $(document).scrollTop();
            //显示或隐藏“返回顶部”按钮
            if(scrolltop>0){
                $('#gototop').show();
            }else{
                $('#gototop').hide();
            }
        });
        //点击“返回顶部”按钮效果
        $('#gototop').click(function(e) {
            $("html, body").animate({ scrollTop: 0 }, 300);
        });
    });
    </script>