使用jQuery滚动到顶部（设置时间：2分钟）

这是逐步为您的网站设置顶部滚动的快速步骤。 对于演示，只需在该站点上向下滚动即可。

1.下载scrollTo插件 ，包括它。
2.获取图像（ 箭头等）。
3.在下面包含一些HTML。
4.在下面包括一些jQuery / JavaScript，以捕获窗口滚动并处理图像显示。
5.就这样！

的HTML

jQuery的

只是一些jQuery，可以在用户向下滚动时显示图像，在用户向上滚动时隐藏图像，并处理click事件。

$(document).ready(function()
{
    var $scrollTop = $('#scroll-to-top');

    $(window).scroll(function()
    {
        //scroll top top
        if ($(this).scrollTop() > 100)
        {
            $scrollTop.fadeIn(1000);
        }
        else
        {
            $scrollTop.hide();
        }
    });

    $scrollTop.bind('click', function(e)
    {
        e.preventDefault();
        $.scrollTo(0, 1000);
    });
});

注意：如果您想使用跨浏览器解决方案，请使用以下命令：

window.scrollTo(0,0); //chrome scroll to top bugfix

的CSS

只是一些简单的CSS即可处理图像显示和跨浏览器的不透明度。

#scroll-to-top {
    position: fixed;
    bottom: 10px;
    right: 10px;
    display: none;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
}
#scroll-to-top:hover {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity: 1.0;
    -khtml-opacity: 1.0;
    opacity: 1.0;
}

From: https://www.sitepoint.com/scroll-top-jquery-setup-time-2mins/