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/#options提供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/。

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

1 个答案: