返回top写法技巧

HTML
<a href="#" class="fixed">top</a>

CSS:

.fixed{
    padding: 20px 15px;
    text-transform: uppercase;
    position: fixed;
    left:50%;
    bottom: 60px;
    margin-left: 475px;      //为总的main容器的宽度/2再加上10px。
    background-color: #000;
    font: normal bold 17px;
    color: #fff;
}

这样做的目的是在不同的分辨率下都能正常。

<script type="text/javascript">
function goTop()
{
    $(window).scroll(function(e) {
        //若滚动条离顶部大于100元素
        if($(window).scrollTop()>100)
            $("#gotop").fadeIn(1000);//以1秒的间隔渐显id=gotop的元素
        else
            $("#gotop").fadeOut(1000);//以1秒的间隔渐隐id=gotop的元素
    });
};
$(function(){
    //点击回到顶部的元素
    $("#gotop").click(function(e) {
            //以1秒的间隔返回顶部
            $('body,html').animate({scrollTop:0},1000);
    });
    $("#gotop").mouseover(function(e) {
        $(this).css("background","url(images/backtop2013.png) no-repeat 0px 0px");
    });
    $("#gotop").mouseout(function(e) {
        $(this).css("background","url(images/backtop2013.png) no-repeat -70px 0px");
    });
    goTop();//实现回到顶部元素的渐显与渐隐
});
</script>