Your Cart

Reply To: Galleria Galleries Not Loading Correctly After Infinite Scroll

These forums are now closed to new replies / tickets.

Please open a support ticket from our new Support page.

Front Page Forums Problems Galleria Galleries Not Loading Correctly After Infinite Scroll Reply To: Galleria Galleries Not Loading Correctly After Infinite Scroll

gravatar
Henry
April 21, 2015 at 12:27 am

Got it working for anyone with a similar problem…

The html (#galleria-1609 is only an eg. I use post-ID to make it
dynamic) and JS in the loop for the first set of posts. Note I am
passing the height ratio as a second class name (for lack of a
better way).

<div id="galleria-1609" class="galleria 0.5">
    <a href="img01-800x400.jpg" alt="Large Image" ><img src="thumb.png" /></a>
    <a href="img02-800x400.jpg" alt="Large Image" ><img src="thumb.png" /></a>
</div>
<script>
    Galleria.run('#galleria-1609', {
        thumbnails: 'numbers',
        height: 0.5, /* ratio */
        preload: 1
    });
</script>

For the posts fetched by Infinite Scroll I created a JS function
which I call from the infinite scroll callback, passing through the
Array of new elements:

function loadSliders(arrayOfNewElems) {
    $(arrayOfNewElems).each(function( i ) {
        $(this).find('.galleria').each(function( j ) {
                        //grab 2nd class name > the height ratio
            var ratio = $(this).attr('class').split(' ')[1];
            var thisID = '#'+ $(this).attr('id');
Galleria.run(thisID, { thumbnails: 'numbers', height: ratio, preload: 1 }); }); }); }

And that is it.



Galleria.io uses cookies to store information. You can read more about that in our Privacy Policy. I understand