JQuery 回到顶部效果

图片,CSS/HTML/JS代码都在,可以直接用了.

CSS代码

?

    <style type="text/css">

        #gs_feedback_gotop

        {

            _display: none;

        }

        #gs_feedback_gotop .side_fixed

        {

            position: fixed;

            right: 20px;

            bottom: 40px;

            z-index: 250;

        }

        #gs_feedback_gotop .to_top

        {

            position: relative;

            display: block;

            width: 35px;

            height: 0;

            margin-left: -8px;

            margin-bottom: 2px;

            padding-top: 35px;

            background: url(/image/go-top.png) no-repeat;

            overflow: hidden;

            cursor: pointer;

            z-index: 2;

            visibility: hidden;

        }

        #gs_feedback_gotop .to_top:hover

        {

            background-position: -36px 0;

        }

        #gs_feedback_gotop .c_fq, #gs_feedback_gotop .c_qs, #gs_feedback_gotop .c_os

        {

            display: block;

            width: 35px;

            height: 0;

            margin-left: -8px;

            padding-top: 35px;

            overflow: hidden;

            cursor: pointer;

            z-index: 2;

            margin-bottom: 2px;

            position: relative;

            background: url(../img/global/go-top.png) no-repeat;

        }

        #gs_feedback_gotop .c_fq

        {

            background-position: 0 -38px;

        }

        #gs_feedback_gotop .c_fq:hover

        {

            background-position: -36px -38px;

        }

        #gs_feedback_gotop .c_qs

        {

            background-position: 0 -76px;

        }

        #gs_feedback_gotop .c_qs:hover

        {

            background-position: -36px -76px;

        }

</style>

HTML代码

?

    <div id="gs_feedback_gotop">

        <div class="side_fixed">

            <a class="to_top" title="回到顶端" href="#top" id="gotop2" style="visibility: visible;

                display: block;"> </a>

        </div>

</div>

JavaScript代码

?

$(document).ready(function () {

    $(window).scroll(function () {

 

        if ($(document).scrollTop() >= 200) {

            $('#gotop2').css('visibility', 'visible');

        } else {

            $('#gotop2').css('visibility', 'hidden');

        }

    });