javascript - 如何降低 Scroll-Top Speed

标签 javascript jquery scroll

ScrollTop 是一个 jquery 插件(转到页面顶部),试图降低滚动速度,但不起作用。我已将 scrollSpeed : 'fast', 更改为 scrollSpeed : 'slow', 但它仍然很快,没有任何变化。

JS:

$.fn.extend({

    addScrollTop: function(options) {

        var defaults = {
                useObjWindow : false,
                scrollSpeed : 'fast',
                zIndex: '99'
            }

            var options = $.extend(defaults, options);  

        if($('body').find('.scrollTop-btn').length == 0) {
            $('body').append('<div class="scrollTop-btn" style="display:none;"><i class="fa fa-chevron-up"></i></div>');
        }

        if(options.useObjWindow) {
            var parentWindow = this;
            var scrollWindow = this;
        }
        else {
            var parentWindow = window;
            var scrollWindow = 'html, body';
        }

        $(document).ready(function() {

            $('.scrollTop-btn').on('click', function() {
                $(scrollWindow).animate({scrollTop:0}, options.scrollSpeed);
            });

            $(parentWindow).scroll(function() { 
                $('.scrollTop-btn').hide();
                var aTop = $('.scrollTop-btn').height() + 20;

                if($(this).scrollTop() >= (aTop + 20)) {
                    $('.scrollTop-btn').css('z-index', options.zIndex);
                    $('.scrollTop-btn').show();
                }
                else {
                    if($('.scrollTop-btn').is(":visible")) {
                        $('.scrollTop-btn').hide();
                    }
                }

            });


        });
    }

});

调用:

jQuery(document).ready(function() {
jQuery("body").addScrollTop();
});

当它到达顶部时,如何让它更慢或更顺畅?

最佳答案

使用 jquery animate()

$('html,body').animate({ scrollTop: 0 }, 'slow');

引用这个stack overflow question

关于javascript - 如何降低 Scroll-Top Speed,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33686523/

相关文章:

javascript - 单击外部时隐藏下拉菜单

javascript - Jquery:计算隐藏输入的宽度

javascript - Bootstrap 部分 View 模式中的 MVC 谷歌地图不起作用

javascript - 取决于页面位置的 CSS 类

javascript - 当 in 元素在视口(viewport)中可见时自动播放 html 视频

javascript - 如何区分通过鼠标滚动和在 JavaScript 中以编程方式滚动?

javascript - 如何使用 phonegap 运行外部 php 脚本?

javascript - jQuery AJAX 自定义 showLoader

javascript - 使用 Javascript 从复选框传递值

javascript - 使用 jquery 对不在 HTML 表中的元素进行排序