jquery - 通过滚动动画 jquery reel

Question

我正在开发一个滚动应用程序 - 请求的功能之一是在用户滚动时为 jquery reel 制作动画 -

我尝试触发框架上的播放和停止功能 - 并将其链接到scrollTop - 但它没有执行任何操作。

http://jsfiddle.net/dxf17mbn/

var threesixty = $('#image').reel({
  image: 'http://test.vostrel.net/jquery.reel/example/object-movie-clockwise-sprite/f1-reel.jpg',
  speed: 0,
  frames: 35,
  cw: true,
  throwable: 1.2
});



console.log("threesixty", threesixty);

var $win = $(window);
$win.on('scroll', function() {
  var top = $win.scrollTop() / 3;

  console.log("top", top)

  var fraction = top / 3;

  $('#image')
    .trigger('play')
    .bind('frameChange', function() {
        console.log("frame change--")
      if ($(this).reel('frame') == 47) {
        $(this).trigger('stop');
      }
    });

});

Answer 1

在提出有关特定插件的问题时，请务必提及这一点，甚至提供其 API 的链接。

只需将触发的事件从 play 更改为 stepRight 就会产生影响。您希望同时使用 stepRight 和 stepLeft，具体取决于用户是向上还是向下滚动。

我还会从 scroll 回调中删除 frameChange 监听器，因为您最终会为此事件添加大量重复的监听器。