orion3dgames / gridder

A jQuery plugin that displays a thumbnail grid expanding preview similar to the effect seen on Google Images.
http://orion3dgames.github.io/gridder/
461 stars 130 forks source link

Gridder with Flickity slider: Slideshow doesn't work after gridder content expands #65

Closed tylerjordanp724 closed 6 years ago

tylerjordanp724 commented 6 years ago

Hi!

I'm currently using the Flickity slider inside of the gridder content and I'm noticing that when the content expands, the slider doesn't work even after I've included the script inside of the 'onContent' function. My guess is that there is something blocking Flickity from being re-initialized after gridder runs, but I'm not 100% sure. Any help or suggestions would be greatly appreciated. Thanks!

tylerjordanp724 commented 6 years ago

I was able to solve this issue myself. In my specific case, since the actual carousel was pretty nested, I just needed to attach an each function to the .gridder-show class and traverse to find the nested carousel like so:

function grid() {
    $('.gridder').gridderExpander({
        scroll: false,
                animationSpeed: 400,
        showNav: true,

                onContent: function() {
            $('.gridder-show').each(function(i){
                $(this).find('.gallery--sm').flickity();
            })

                }

    });
}