jQuery循环插件幻灯片延迟，直到onBefore完成

我试过了我能想到的所有内容，但我似乎无法延迟jQuery Cycle插件的幻灯片，直到完成后我的onBefore动画完成。我试着用循环（'toggle'）使用delay（）和setTimeout（）。任何人都有关于如何推迟下一张幻灯片的任何想法，直到onBefore中的所有内容完成为止？jQuery循环插件幻灯片延迟，直到onBefore完成

$('#feature').cycle({ 
    fx:  'scrollLeft', 
    easing: 'easeOutExpo', 
    speed: 1000, 
    timeout: 3000, 
    before: onBefore 
}); 

function onBefore(curr, next, opts, forwardFlag) { 
    $(curr).children("div").animate({ left : '960px' }, 300, function() { }); 
}

来源

2011-12-13 jdehlin

似乎没有办法延迟幻灯片转换，直到onBefore完成。作为一项解决方案，我能够通过基本描述下一张幻灯片在当前幻灯片的onAfter过渡之前会发生什么，从而做到我需要的内容。

/*手动描述动画的第一个*/

$('#feature .featureStory:first').children("a").delay(4500).animate({marginTop:'100'}, 500);

/*传递周期所说的 '后' 和 'skipInitializationCallbacks' */

$('#feature').cycle({ 
    fx: 'scrollLeft', 
    easing: "easeOutExpo", 
    speed: 1000, 
    timeout: 6000, 
    after: onAfter, 
    skipInitializationCallbacks: true 
});

/*是否所有您下一张幻灯片中的动画在当前幻灯片后*/

function onAfter(curr, next, opts, ff) { 
    $(next).children(".featureStory").animate({left:'560px'}, 500, function(){ 
    $(this).children("a").animate({marginTop:'0'}, 500); 
    $(this).children("a").delay(3500).animate({marginTop:'100'}, 500); 
    $(next).children(".featureStory").delay(4500).animate({ left : '960px' }, 500); 
    }); 
}

现在我是sur如果没有完整的上下文，这真的让人感到困惑，但它应该让您了解如何在幻灯片切换之前通过使用上一张幻灯片的onAfter和一些延迟来在适当的时间执行某些事情来执行动画。

来源

2011-12-15 18:08:49 jdehlin

jQuery循环插件幻灯片延迟，直到onBefore完成

回答

相关问题