Question

所以我试图制作一个由某个滚动值触发的计数器，换句话说，我希望用户在达到某个滚动值后看到从0到指定数字的动画数字

这就是我到目前为止所做的：

$(document).scroll(function(){

    var _scrollTop = $(document).scrollTop();

    if(_scrollTop >= 1490){
        $('.Count').each(function () {
            var $this = $(this);
                jQuery({ Counter: 0 }).animate({ Counter: $this.text() }, {
                    duration: 3000,
                    easing: 'swing',
                    step: function () {
                        $this.text(Math.ceil(this.Counter)).stop();
                    }
                });
        }); 
    }
});

但每当我滚动到该值之上时，数字会保持刷新，当用户滚动到该值之上然后保持在html上的指定值时，我希望它动画一次非常感谢你的帮助

Full site Fiddle

Answer 1

如果滚动功能不必再次运行，在第一次满足条件后（计数器启动），您可以选择完全取消绑定该功能：

if(_scrollTop >= 1490){
    $(document).unbind('scroll');
    //......

这将取消绑定文档上的所有绑定滚动事件，如果实现多个滚动事件，则可以将特定委托存储在变量中并取消绑定。

由滚动值触发的jquery数字计数器动画

1 个答案: