Thumbnail Grid with Expandable Preview

Hello!

I created a Thumbnail Grid with Expandable Preview using this plugin: GitHub - oriongunning/gridder: A jQuery plugin that displays a thumbnail grid expanding preview similar to the effect seen on Google Images..

Here’s the cloneable WF: https://webflow.com/website/omars-sandbox

FYI, I’d like to use it to showcase team members on a webpage. The end result should look something like this: About Grovemade® | Story, Portland Hometown & Product Design (please scroll half-down the page).

As you’ll see, my prototype is working. However, it comes with one glitch I don’t quite know how to fix.

Basically, if you expand a box of the first row and start flicking through the following previews by clicking on the “next” button, you’ll get a nice smooth effect. However, if you keep doing this, as you get to the boxes of the second row you’ll start noticing the glitch I’m talking about.

I tried pretty much everything to fix this and the only way I found to do it is to set padding-bottom: 1500 px (or something like that) for the the body element. However, as you can imagine this is not the best way to fix this problem it generates another one.

Any ideas as to how to fix this?

Thanks in advance for you suggestions.

Did you try to change animation value in the code?