Question

我想在页面上动态更改jquery循环的选项。具体来说，我希望速度下降。根据它的一个创建者，你可以使用'cycle.opts'来做到这一点。在我的例子中，我有具体的

$('.cycle-streams').cycle({
    fx: 'scrollVert',
    continuous: 1,
    speed: 1000,
    delay: 0,
    easing: 'linear'
});

var changedOpts = $('.cycle-streams').data('cycle.opts');

$('.cycle-streams').mouseover(function() {
    var changedOpts = $('.cycle-streams').data('cycle.opts');
    changedOpts.speed = 1000000000000;
    $('.cycle-streams').data('cycle.opts', changedOpts);
});

我一直在研究这个问题已经有一段时间了，我对自己错在哪里感到很失落。任何帮助，将不胜感激。 jsfiddle在这里...... http://jsfiddle.net/bmXgj/

Answer 1

我改变了你的小提琴：

var changedOpts = $('.cycle-streams').data('cycle.opts');

$('.cycle-streams').mouseover(function() {
    //hover in
    $('.cycle-streams').cycle('pause');
    changedOpts.speedIn = 500;
    changedOpts.speedOut = 500;
    $('.cycle-streams').cycle('next');
    $('.cycle-streams').cycle('resume');   
});

$('.cycle-streams').mouseout(function() {
    //hover out
    $('.cycle-streams').cycle('pause');
    changedOpts.speedIn = 3000;
    changedOpts.speedOut = 3000;
    //$('.cycle-streams').cycle('next');
    $('.cycle-streams').cycle('resume');
});

我注意到你出于某种原因重新宣布'changedOpts'。当我在控制台中看到这个变量时，它是未定义的。既然你已经定义了它，我就继续使用它。

你也永远不会重置周期的状态。我添加了暂停并恢复~~。它似乎现在工作，但它并不完美。在使用新速度之前，最后一侧需要清除，因此激烈的跳跃（例如3000到500）在尝试加速时会有明显的延迟。~~我还添加了下一个声明。

我注意到当插件正在处理时，它正在清除超时。所以我想如果我存储剩余时间（暂停），然后移动到下一张幻灯片（下一张），然后恢复显示（恢复）时间将恢复。这似乎有效。

从快速到慢速时不需要“下一个”动作，因为在离开容器时通常不会注意到“孤儿”滑动，因为它快速循环。我把它放在那里，以防你的速度差距太大。

我也注意到你只改变了一个速度。 ~~我假设在没有查看插件的内容的情况下，'speed'选项仅在初始化时使用。在添加了另外两个速度后，我得到了正确的操作。~~在查看插件的“胆量”之后，我确信速度选项用于同步其他两个速度。如果它们都不匹配，您可能会失去同步。初始化代码使用'speed'来设置'speedIn'和'speedOut'，所以我们需要更改这两个以影响'running'速度。

http://jsfiddle.net/bmXgj/6/

编辑：不需要暂停和恢复。

EDIT2：我确实需要暂停和恢复，但我还需要下一个。一旦第一次设置开始循环，“速度”选项也可以忽略。它似乎是speedIn = speedOut = X

的简写

Jquery循环更改选项

1 个答案: