Hi everyone,
I’m facing an issue with my cards in Webflow. When I hover over them, without leaving the container, the bottom image disappears after one second. I can’t figure out what’s causing this behavior.
Has anyone encountered a similar issue or have an idea of what might be wrong? Any help would be greatly appreciated!
Here’s my read-only link : Webflow - Lapizza
Thanks in advance!
Hello Guilian!
I noticed when you move the mouse pointer fast between cards the issue happens, and if you move the pointer slowly between the cards the issue no longer happens, that’s because you have two states of positioning for the elements needed to have the effect, first position is the actual design and the second is the animation initial state you set, the time it takes for each Hover effect from initial to finish is 1.30 seconds, which is exactly the time needed for the Hover out of one element before moving the pointer to have a Hover in since those elements share the same class.
in the design state, choose the positioning of the elements needed to be affected by the hover to be out of site for [top and bottom images], the " Hover on ", the elements should move inside the card to the desired position, and " Hover out " they should move back to their set positioning " which is out of site.
If you just move and opacity into and out of cards, will do it for you, instead of having a design position inside the card and an initial state before desired hover effect starts.
I hope that will help you.