您的位置:首页 > Web前端 > JavaScript

js 返回顶部

2012-02-28 09:33 204 查看
js 部分

(function() {

var $backToTopTxt = "返回顶部", $backToTopEle = $('<div class="backToTop"></div>').appendTo($("body"))

.text($backToTopTxt).attr("title", $backToTopTxt).click(function() {

$("html, body").animate({ scrollTop: 0 }, 120);

}), $backToTopFun = function() {

var st = $(document).scrollTop(), winh = $(window).height();

(st > 0)? $backToTopEle.show(): $backToTopEle.hide();

//IE6下的定位

if (!window.XMLHttpRequest) {

$backToTopEle.css("top", st + winh - 166);

}

};

$(window).bind("scroll", $backToTopFun);

$(function() { $backToTopFun(); });

})();

CSS部分

<style tyle="text/css">

.backToTop {display: none;width: 18px;line-height: 1.2;padding: 5px 0;background-color: #000;color: #fff;font-size: 12px;text-align: center;position: fixed;

_position: absolute;right: 10px;bottom: 100px;_bottom: "auto";cursor: pointer;opacity: .6;filter: Alpha(opacity=60);}

</style>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: