Slide Animation not reacting consistently

Hello,

I have a div that is positioned out of site and then slides down upon hoover. However, the hoover sometimes pushes down further than intended especially when you move your mouse around the image.

Also, I have an animated gif show upon hover and it works on desktop but not on mobile.

This is an issue in both the mobile landscape and portrait.

I have a video to helo understand

Untitled - YouTube

Here is my public share link:
https://preview.webflow.com/preview/elise-design?preview=e73fccd5e59094627930d2d98198fca7

Hi Elise. You might want to give your columns defined heights since they are set to 100% height. But 100% height is possible if the parent element also has a set height. So when your gallery col collapses into a single block on mobile, the is basically no height to reference and the only reason you see the column is because of the image in the container.

So consider adding a set height to your column, use flexbox or use a float-based gallery with the last two being the pouplar choice by many.

Here is a tutorial you can go through about gallery hover states;

https://webflow.com/blog/how-to-create-a-thumbnail-overlay

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.