MaxImage2 with scrollHorz effects

0
votes

I'm using MAXIMAGE 2 to make simple image slideshow. I try to use horizontal scroll effects ( i.e. fx:scrollHorz ). The JSFiddle is here.

The problem is, the animation transition does not happen. It goes directly to 2nd slide without animation. Is this a bug of MAXIMAGE 2?

HTML:

<!-- Maximage / Cycle -->
<div id="maximage">
    <img src="http://www.aaronvanderzwan.com/maximage/2.0/lib/images/demo/coalesse.jpg" alt="" />
    <img src="http://www.aaronvanderzwan.com/maximage/2.0/lib/images/demo/wall_portrait.jpg" alt="" />
    <img src="http://www.aaronvanderzwan.com/maximage/2.0/lib/images/demo/laughing.jpg" alt="" />
    <img src="http://www.aaronvanderzwan.com/maximage/2.0/lib/images/demo/pattern.jpg" alt="" />
    <img src="http://www.aaronvanderzwan.com/maximage/2.0/lib/images/demo/roof_shooting.jpg" alt="" />
    <img src="http://www.aaronvanderzwan.com/maximage/2.0/lib/images/demo/man.jpg" alt="" />
    <img src="http://www.aaronvanderzwan.com/maximage/2.0/lib/images/demo/coffee_shop.jpg" alt="" />
    <img src="http://www.aaronvanderzwan.com/maximage/2.0/lib/images/demo/gas_station.jpg" alt="" />
</div>

JS:

$(function() {
    var imgs = $('#maximage img');
    imgs.sort(function() { return 0.5 - Math.random() });
    $('#maximage').html( imgs );

    $('#maximage').maximage({
        cycleOptions: {
            fx: 'scrollHorz',
            speed: 3000
        }
    });
});
1
jqueryjquery-cyclemaximage2

1 Answers

2
votes

To make scrollHorz work without fillElement config, I have to add cssTransitions: false in the Maximage 2, as follow:

$(function() {
    var imgs = $('#maximage img');
    imgs.sort(function() { return 0.5 - Math.random() });
    $('#maximage').html( imgs );

    $('#maximage').maximage({
        cycleOptions: {
            fx: 'scrollHorz',
            speed: 3000
        },
        cssTransitions: false
    });
});

Not sure if it is a bug of MaxImage 2.