javascript - jQuery - MaxImage 2.0 和 Cycle - 具有单独循环选项的多个幻灯片

Question

我有一个使用MaxImage 2.0 jQuery 插件（又使用jQuery Cycle）的带有两个幻灯片的页面。

MaxImage 允许您传递循环插件的选项。我遇到的问题是只有最后一组循环选项生效。这似乎也适用于其他一些 MaxImage 选项，包括“fillElement”。

这是我的 jQuery：

$(function () {
$('#slider-one').maximage({
    cycleOptions: {
        fx: 'fade',
        speed: 800,
        timeout: 1000,
    },
    fillElement: '#panel-one',
    backgroundSize: 'contain'
});
});

$(function () {
$('#slider-two').maximage({
   cycleOptions: {
       fx: 'fade',
       speed: 800,
       timeout: 2000,
     },
     fillElement: '#panel-two',
     backgroundSize: 'contain'
});

});

以及 jsfiddle 上的所有内容 - http://jsfiddle.net/seanhawkridge/FNgXe/1 - 如果您删除/注释掉第二个函数，您就会明白我的意思。

Answer 1

如果您仍然需要问题的答案 - 您应该在第一个回调中运行第二个幻灯片（由 Maximage http://blog.aaronvanderzwan.com/2012/07/maximage-2-0/提供的 onFirstImageLoaded 或 onImagesLoaded #选项）

$(function () {
$('#slider-one').maximage({
    cycleOptions: {
        fx: 'fade',
        speed: 800,
        timeout: 1000,
    },
    fillElement: '#panel-one',
    backgroundSize: 'contain',
    onImagesLoaded: function() {
        $('#slider-two').maximage({
           cycleOptions: {
               fx: 'fade',
               speed: 400,
               timeout: 2000,
             },
             fillElement: '#panel-two',
             backgroundSize: 'contain'
        });       
    }

});
});

结帐http://jsfiddle.net/FNgXe/30/。