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

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

您可以触发一些事件来播放，停止和暂停动画，还可以检测到当前正在播放的帧(.reel(“frame”))，但是我真的无法弄清楚如何将它们放在一起以创建一个链接播放特定框架的卷轴，然后停止。有什么建议么？

最佳答案

您可以对其进行"play"编码，绑定(bind)到"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将为指向指定框架的最短路径设置动画，并在此处停止。