使用 Waypoint 启动 Jquery 动画答案

【问题标题】：Initiate Jquery animation with Waypoint使用 Waypoint 启动 Jquery 动画
【发布时间】：2014-02-17 13:50:39
【问题描述】：

我正在使用 Jquery Knob，它会在页面加载时自动运行。我似乎无法弄清楚在此函数中插入 Waypoint 调用的位置。任何建议都非常感谢。

            <script>
                 $(document)(function () {
                    $('.dial').knob({
                        min: '0',
                        max: '100',
                        readOnly: true
                    });

                    $('.dial').each(function(){
                        $(this).animate({
                            value: $(this).data('number')
                        },{
                            duration: 950,
                            easing: 'swing',
                            progress: function () {
                                $(this).val(Math.round(this.value)).trigger('change');
                            } // progress:function
                        }); // middle
                    }); //dial.each.function
                }); // function
                </script>

【问题讨论】：

标签： animation jquery-plugins jquery-waypoints jquery-knob

【解决方案1】：

以下应该有效。

$(document)(function () {
    $('.thing').waypoint(function(direction) {  // Change ".thing" to the div class containing your knobs //
        $('.dial').knob({
           min: '0',
           max: '100',
           readOnly: true
         });

    $('.dial').each(function(){
        $(this).animate({
        value: $(this).data('number')
        },{
            duration: 950,
            easing: 'swing',
            progress: function () {
            $(this).val(Math.round(this.value)).trigger('change');
            } // progress:function
            }); // middle
        }); //dial.each.function
    });
}); // function

【讨论】：