jquery返回顶部特效

jquery返回顶部特效,制作起来很简单。下面是具体实现代码。

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

 

posted @ 2016-07-17 16:06  林育松  阅读(231)  评论(0编辑  收藏  举报