返回顶部的插件

插件 manhuatoTop.js

/***
 * 返回顶部
 * version:manhuatoTop.1.0.js
***/
$(function() {
  $.fn.manhuatoTop = function(options) {
    var defaults = {      
      showHeight : 150,
      speed : 1000
    };
    var options = $.extend(defaults,options);
    $("body").prepend("<div id='totop'><a></a></div>");
    var $toTop = $(this);
    var $top = $("#totop");
    var $ta = $("#totop a");
    $toTop.scroll(function(){
      var scrolltop=$(this).scrollTop();    
      if(scrolltop>=options.showHeight){       
        $top.show();
      }
      else{
        $top.hide();
      }
    }); 
    $ta.hover(function(){     
      $(this).addClass("cur");  
    },function(){     
      $(this).removeClass("cur");   
    }); 
    $top.click(function(){
      $("html,body").animate({scrollTop: 0}, options.speed);  
    });
  }
});

　　样式 manhuatoTop.css

*{}
#totop{position:fixed;bottom:40px;right:8px;z-index:999;width:40px; cursor:pointer; display:none;}
*html #totop{position:absolute;cursor:pointer;right:10px; display:none;top:expression(eval（document.documentElement.scrollTop+document.documentElement.clientHeight)-112+"px")}
#totop a{display:block;width:40px;height:60px;background:url(../images/toTop.gif) no-repeat;}
#totop a.cur{background-position:-40px 0;}

　　使用方法

<script type="text/javascript" src="/static/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="/static/js/manhuatoTop.1.0.js"></script>
 <link rel="stylesheet" type="text/css" href="/static/css/manhuatoTop.1.0.css">
<script type="text/javascript">
$(function (){
  $(window).manhuatoTop({
    showHeight : 100,//设置滚动高度时显示
    speed : 500 //返回顶部的速度以毫秒为单位
  });
});

</script>

作者：panie