jquery的返回顶端的功能实现

　　页面很长的时候，读到最下面，需要返回顶端，则在页面最下面布局一个返回顶部的图标很有用。

　　具体功能是，jquey控制，向下滚动出现返回顶部图片，若滚动返回顶部或点回顶部，则图标消失。

　　实现效果如下图：

　　

　　1.布局：

<a id="toTop" class="toTop" href="#"></a>

　　2.css代码：

.toTop{
    position: fixed;
    right: 40px;
    bottom: 14px;
     40px;
    height: 40px;
    overflow: hidden;
    display: none;
    background: url(../images/to-top1.png) no-repeat 0px 0px;
}

　　3。jquery代码：

<script type="text/javascript">

        //当滚动条的位置处于距顶部100像素以下时，跳转链接出现，否则消失
        $(function () {
            $(window).scroll(function(){if ($(window).scrollTop()>100){
                    $("#toTop").fadeIn(500);
                }
                else
                {
                    $("#toTop").fadeOut(500);
                }
            });
 
            //当点击跳转链接后，回到页面顶部位置
 
            $("#toTop").click(function(){
                $('body,html').animate({scrollTop:0},500);
                return false;
            });
        });
 
</script>

 　　既然随笔必须150字，就写一些我之后想总结的东西吧。前端就是H5和js和jquery的深度学习及bootstrap框架的掌握；后端就是java的框架了，因为之前一直搞php，asp.net，现在想把java学深点。