Question

我一直致力于让网站看起来更整洁，更好。我添加了一个按钮，将页面滚动回顶部。但是，它立即实现，我希望它能逐渐实现。我现在知道我可以使用animate()但不知道如何使用它。知道怎么做吗？它的当前代码如下：

＆＃13;

$(document).ready(function(){
    $("#return-top").click(function(){
        $(".wsb-canvas-page-container").scrollTop(0);
    });
});

＆＃13;

#return-top {
    position: fixed !important;
    bottom: 100px !important;
    right: 20px !important;
    background: rgb(136, 0, 0) !important;
    background: rgba(136, 0, 0, 0.7) !important;
    width: 50px !important;
    height: 50px !important;
    display: block;/**DO NOT PUT `!important`!**/
    text-decoration: none !important;
    -webkit-border-radius: 35px !important;
    -moz-border-radius: 35px !important;
    border-radius: 35px !important;
    /****display: none;/**DO NOT PUT `!important`!**/
    -webkit-transition: all 0.3s linear !important;
    -moz-transition: all 0.3s ease !important;
    -ms-transition: all 0.3s ease !important;
    -o-transition: all 0.3s ease !important;
    transition: all 0.3s ease !important;
    border: white 4px solid;
}
#return-top i {
    color: #fff !important;
    margin: 0 !important;
    position: relative !important;
    left: 16px !important;
    top: 13px !important;
    font-size: 19px !important;
    -webkit-transition: all 0.3s ease !important;
    -moz-transition: all 0.3s ease !important;
    -ms-transition: all 0.3s ease !important;
    -o-transition: all 0.3s ease !important;
    transition: all 0.3s ease !important;
}
#return-top:hover {
    background: rgb(0, 0, 0) !important;
    background: rgba(0, 0, 0, 0.9) !important;
}
#return-top:hover i {
    color: #fff !important;
    top: 5px !important;
}

＆＃13;

<a href="javascript:" id="return-top"><i class="icon-chevron-up"></i></a>


<!-- ICON NEEDS FONT AWESOME FOR CHEVRON UP ICON -->
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

＆＃13;

我之前看过它的动画，但我不知道该怎么做。该问题被确定为another question的可能副本。但是，我（对JavaScript和JQuery知之甚少）并不了解如何在其中应用信息。因此，这个当前的问题可能需要自己的答案。

如何制作scrollTop动画？

0 个答案: