CSS小知识---回到顶部

所需js文件

<script type="text/javascript" src="js/jquery-1.11.3.js"></script>

在body中添加

<a id="goTop" class="gotoTop" href="#"><img src="images/top.png"></a>

.gotoTop的style样式

.gotoTop {
    display: none;
    bottom: 20px;
    height: 70px;
    position: fixed;
    right: 20px;
    width: 70px;
}

js函数

$(function () {
    $("#goTop").click(
        function(){$('html,body').animate({scrollTop:0},700);}//滚动条的垂直位置设为0,页面移动速度为700
    )
    $(window).scroll(function(){
        var s = $(window).scrollTop(); //返回滚动条的垂直位置
        if( s > 0){
            $("#goTop").fadeIn(100);
        }else{
            $("#goTop").fadeOut(200);
        };
    });
})

如此，即可实现回到顶部的功能。