页面置顶的悬浮按钮

1、首先需要一张悬浮的图片
2、需要jquery的jar文件<script type="text/javascript" src="js/jquery-1.10.1.min.js"></script>
3、然后添加如下代码：
<script type="text/javascript">
$(function(){
var $img = $('<img alt="Top_arrow" class="top_arrow" id="top_arrow" src="./images/top_arrow.png" />');
$("body").append($img);
    $(window).scroll(
      function(){
         $(window).scrollTop() > 20 ? $img.fadeIn(400) : $img.fadeOut(400)
     });
     $("body, html").scroll(
      function(){
         $("body,html").scrollTop() > 20 ? $img.fadeIn(400) : $img.fadeOut(400)
      });
      $img.click(
       function(){
         $("body,html").animate({scrollTop:0},400);
       });

    $("#top_arrow").hide(),
    $(window).scroll(
        function(){
            $(window).scrollTop() > 20 ? $("#top_arrow").fadeIn(400) : $("#top_arrow").fadeOut(400)
        }),
    $("body, html").scroll(
        function(){
            $("body,html").scrollTop() > 20 ? $("#top_arrow").fadeIn(400) : $("#top_arrow").fadeOut(400)
        }),
    $("#top_arrow").click(
        function(){
            $("body,html").animate({scrollTop:0},400);
        })
    
});
</script>
4、添加如下css样式：
<style>
.wraper{
    width:960px;
    margin:0 auto
}
.top_arrow{
    border:0 none;
    bottom:150px;
    cursor:pointer;
    display:none;
    height:auto;
    margin:0;
    opacity:0.5;
    padding:0;
    position:fixed;
    right:40px;
    width:35px;
    z-index:2147483647;
}
</style>

5、打开页面，滚动鼠标滑轮即可看到效果