返回頂部代碼-copy自51cto

 看到51cto博客新增了返回頂部按鈕,這很實用,正好自己也在搗鼓着一個破網站,就查看源碼,加上唄!

<style>
  .backToTop {
  display: none;
  WIDTH: 45px;
  height:45px;
  BOTTOM: 20px;
  position: fixed;
  _position: absolute;
  right: 140px;
  bottom: 10px;
  _bottom: "auto";
  cursor: pointer;
  opacity: .6;
  filter: Alpha(opacity=60);
  text-indent:-9999px;
  }
  .tops { background:url(/p_w_picpaths/tops.jpg) no-repeat center center; }
  </style>
  <script type="text/javascript">
  (function() {
  var backToTopTxt = "返回頂部", backToTopEle = $('<div class="backToTop tops"></div>').appendTo($("body"))
  .text(backToTopTxt).attr("title", backToTopTxt).click(function() {
  $("html, body").animate({ scrollTop: 0 }, 520);
  }), backToTopFun = function() {
  var st = $(document).scrollTop(), winh = $(window).height();
  (st > 0)? backToTopEle.show(): backToTopEle.hide();
  //IE6下的定位
  if (!window.XMLHttpRequest) {
  backToTopEle.css("top", st + winh - 60);
  }
  };
  $(window).bind("scroll", backToTopFun);
  $(function() { backToTopFun(); });
  })();
  </script>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章