如何将jQuery Reel播放到特定的帧并停在那里?

Nil*_*ils 2 javascript jquery javascript-events

jQuery Reel(http://jquery.vostrel.cz/reel)是一个出色的jquery插件,用于创建漂亮的360度视图.

有些事件你可以触发播放,停止和暂停动画,还可以检测你当前在哪个帧上(.reel("frame"))但我真的无法弄清楚如何将它们放在一起创建一个链接播放特定帧的卷轴,然后停止.有什么建议?

Pet*_*rel 9

你可以"play",绑定到"frameChange"事件以检查目标帧以及何时到达"stop"它.像这样的东西:

$('#your_reel_image')
.trigger('play')
.bind('frameChange', function(){
    if ($(this).reel('frame') == target_frame){
        $(this).trigger('stop');
    }
});
Run Code Online (Sandbox Code Playgroud)

要知道这样一个事实,即像移动较慢的设备,一些框架可以以与所需的动画速度跟不上跳过.

您还会收到frame第三个事件处理程序参数.reel(),以便在处理程序中保存额外的调用,因此上面的内容可以重构为:

$('#your_reel_image')
.trigger('play')
.bind('frameChange', function(e, depr_frame, frame){
    if (frame == target_frame){
        $(this).trigger('stop');
    }
});
Run Code Online (Sandbox Code Playgroud)

编辑:

从版本1.3开始,您只需调用以下内容即可替换上述解决方案:

$('#your_reel_image').trigger('reach', target_frame);
Run Code Online (Sandbox Code Playgroud)

卷轴将动画朝向给定帧的最短路径并停在那里.

  • 实际上有.触发[`"play"`event](http://test.vostrel.cz/jquery.reel/docs/jquery.reel.html#play-Event)时发送新的速度,就像这样`.trigger('play' ,0.5)`.请参阅Github上的[问题#110](https://github.com/pisi/Reel/issues/110). (2认同)