js返回頂部代碼

直接貼代碼：(注：要先加載jquery)

轉載自：http://www.fkblog.org/blog207

js返回頂部

實例查看：http://www.fkblog.org/demo/javascript/back-to-top.html

相關文章：js側欄置頂置底代碼查看：js側欄置頂置底代碼

<div style="display:none;" class="back-to" id="toolBackTop">
<a title="返回頂部" onclick="window.scrollTo(0,0);return false;" href="#top" class="back-top">
返回頂部</a>
</div>

<style>

.back-to {bottom: 35px;overflow:hidden;position:fixed;right:10px;width:50px;z-index:999;}
.back-to .back-top {background: url("back-top.png") no-repeat scroll 0 0 transparent;display: block;float: right;height:50px;margin-left: 10px;outline: 0 none;text-indent: -9999em;width: 50px;}
.back-to .back-top:hover {background-position: -50px 0;}
</style>
<script type="text/javascript">
$(document).ready(function () {
        var bt = $('#toolBackTop');
        var sw = $(document.body)[0].clientWidth;

        var limitsw = (sw - 1060) / 2 - 40;
        if (limitsw > 0){
                limitsw = parseInt(limitsw);
                bt.css("right",limitsw);
        }

        $(window).scroll(function() {
                var st = $(window).scrollTop();
                if(st > 30){
                        bt.show();
                }else{
                        bt.hide();
                }
        });
})
</script>
<h5><span style="color: #339966;">
</span></h5>
<div id="toolBackTop" class="back-to" style="display: none;"><a class="back-top" title="返回頂部" onclick="window.scrollTo(0,0);return false;" href="#top"> 返回頂部</a></div>
<script type="text/javascript">// <![CDATA[
$(document).ready(function () {

var bt = $('#toolBackTop');

var sw = $(document.body)[0].clientWidth;

var limitsw = (sw - 1060) / 2 - 40;

if (limitsw > 0){

limitsw = parseInt(limitsw);

bt.css("right",limitsw);

}

$(window).scroll(function() {

var st = $(window).scrollTop();

if(st > 30){

bt.show();

}else{

bt.hide();

}

});

})
// ]]></script>

js返回頂部實例查看：http://www.fkblog.org/demo/javascript/back-to-top.html

相關文章：js側欄置頂置底代碼查看：js側欄置頂置底代碼
圖片素材：

轉載請註明：FKBlog » js 返回頂部代碼