现在各种大型网站都非常注重用户体验,而良好用户体验可以从细微之处看出,比如这些返回顶部按钮。
CSS代码：
JS代码：
CSS代码：
01..backToTop {
02.display: none;
03.width: 18px;
04.line-height: 1.2;
05.padding: 5px 0;
06.background-color: #000;
07.color: #fff;
08.font-size: 12px;
09.text-align: center;
10.position: fixed;
11._position: absolute;
12.right: 10px;
13.bottom: 100px;
14._bottom: "auto";
15.cursor: pointer;
16.opacity: .6;
17.filter: Alpha(opacity=60);
18.}
JS代码：
01.(function() {
02.var $backToTopTxt = "返回顶部", $backToTopEle = $('
03.
04.').appendTo($("body"))
05..text($backToTopTxt).attr("title", $backToTopTxt).click(function() {
06.$("html, body").animate({ scrollTop: 0 }, 120);
07.}), $backToTopFun = function() {
08.var st = $(document).scrollTop(), winh = $(window).height();
09.(st > 0)? $backToTopEle.show(): $backToTopEle.hide();
10.//IE6下的定位
11.if (!window.XMLHttpRequest) {
12.$backToTopEle.css("top", st + winh - 166);
13.}
14.};
15.$(window).bind("scroll", $backToTopFun);
16.$(function() { $backToTopFun(); });
17.})();
0则回应给“返回顶部的js实现(jQuery)”