通过滚动动画 jquery 卷轴

Question

我正在开发一个滚动应用程序——请求的功能之一是在用户滚动时为 jquery 卷轴设置动画——

我尝试触发播放 - 并在帧上停止功能 - 并将其链接到 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 侦听器，因为您最终会为此事件添加大量重复的侦听器。