当用户滚动到特定部分时，jQuery激活函数

Question

我一直在使用progressbar.js为路径填充设置动画，这很顺利，但是我遇到了用户加载页面时动画/功能正在播放的问题。

计划是当用户滚动到包含它的部分时运行的函数。

JSFiddle - https://jsfiddle.net/y12e8uks/1/

我已尝试使用$(window).scroll事件，但我在现有功能中实现了一些问题。

任何帮助都会很棒！

感谢。

Answer 1

试试这个：

var bar = new ProgressBar.Path('#heart-path', {
  easing: 'easeInOut',
  duration: 1400
});
$(window).scroll(function() {
   var hT = $('#container').offset().top,
       hH = $('#container').outerHeight(),
       wH = $(window).height(),
       wS = $(this).scrollTop();
   if (wS > (hT+hH-wH)){
       $('.count').each(function() {
    $(this).prop('Counter', 0).animate({
        Counter: $(this).text()
    }, {
        duration: 2000,
        easing: 'linear',
        step: function (now) {
            $(this).text(Math.ceil(now));
            $(this).append("%");
        }
    });
});
   }
});