1

我正在使用 jqueryslideDown()并slideUp()在gototop滚动条高度超过200px.

问题：

链接滑动动作混在一个fast mouse wheel up and down. 由于0.4 sec幻灯片功能的运行时间。我试图定义一个visible flag并complete functions防止混合。但并不成功。

提琴手

向下滚动result block以查看链接并尝试上下快速滚动。如果结果块在屏幕上的高度很大，请降低高度以查看动作。

impress: function () { 
    if ($(window).scrollTop() > this.MIN_SCROLL_HEIGHT 
        && !this.buttonVisibleFlag) 
    { 
        this.button.slideDown(400, function() {
            Blue.buttonVisibleFlag = true;
        });
    }
    else if ($(window).scrollTop() <= this.MIN_SCROLL_HEIGHT 
             && this.buttonVisibleFlag) 
    {
        this.button.slideUp(400, function() {
            Blue.buttonVisibleFlag = false;
        });
    }
}

任何想法或帮助将不胜感激。

4

1 回答 1

3

我认为您最好的选择是仅在用户停止滚动一段时间后才执行滑动操作。我发现这种方法可以检测用户何时停止滚动并在您的代码中实现，结果如下：

更新的小提琴

var Blue = {
    MIN_SCROLL_HEIGHT: 200,
    button: null,
    buttonVisibleFlag: null,

    init: function () {
        this.button = $(".gototop");
        this.buttonVisibleFlag = false;
        this.setWindowBindings();
    },
    setWindowBindings: function () {
        $(window).scroll(function () {
            //perform actions only after the user stops scrolling
            clearTimeout($.data(this, 'scrollTimer'));
            $.data(this, 'scrollTimer', setTimeout(function () {
                Blue.impress();
            }, 150));
        });
    },
    impress: function () {
        if ($(window).scrollTop() > this.MIN_SCROLL_HEIGHT) {
            this.button.slideDown();
        } else if ($(window).scrollTop() <= this.MIN_SCROLL_HEIGHT) {
            this.button.slideUp();
        }
    }
}

$(document).ready(function () {
    Blue.init();
});

注意：您可能需要调整超时间隔以满足您的需要

于 2013-08-29T06:01:52.507 回答