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

Question

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

您可以触发播放，停止和暂停动画的事件，以及检测您当前所在的帧（.reel（“frame”）），但我无法确定如何将它们组合在一起创建一个播放特定帧的卷轴的链接，然后停止。有什么建议吗？

Answer 1

您可以"play"它，绑定到"frameChange"事件以检查目标框架以及何时到达"stop"它。像这样：

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

请注意这一事实，在移动设备等较慢的设备上，可能会跳过某些帧以保持所需的动画速度。

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

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

修改

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

$('#your_reel_image').trigger('reach', target_frame);

Reel将为指定帧的最短路径设置动画并停在那里。