I hover parent div and opacity goes down a bit + the image scale goes up (the image slowly zooms in while hovering) and goes back when not hovering. However, after hovering, the gradient sibling just poofs for the rest of the website experience.
It’s hard to pinpoint why thats happening because of the structure of that. Why not just set a background image to the link div and get rid of the 2 nested divs? There is also no reason to use an interaction for that type of effect, it can be done with simple hover effects. How to create a hover effect - Webflow Tips - Forum | Webflow
Hmm, it seems I have to have the same ease timing for both hover in and hover out. I’d like a fast hover out, and a slow, dramatic hover in. Anyway to change the ease out timer like this?
Also, the easy way still has same issue: the gradient div poofs and doesn’t return. When a transform happens, it seems to gain +10000 z axis or something O__o
EDIT: It seems EVERY interaction (including the one built into the class I could use) seems to permanently raise the Z axis. What the… bug?
Ok it’s official - something is seriously strange and believe it’s a bug. ANY effect that affects another element will permanently raise the z axis or in someway that it goes permanently “in front” of other elements. I’ve reproduced this with several elements in different ways.
You can’t set a different hover/ un hover transition time. I really don’t see why this would really be needed honestly, it’s fractions of a second. Not sure whats going on with the Z axis but it doesn’t happen for me in another site. I encourage you to try recreating it in a new site and see if it still does it. If it doesn’t, it’s likely due to the site structure.
I’d remove all interactions and just use hover effects for your purposes.
Fractions of a second for a default? Yes – but I wanted a slow, dramatic zoom in when hovered, then a default time let go.
With the integrated transition, it would take 4 seconds to go back to position on mouse out. That’s just tacky.
It’s a webflow bug - I found a workaround by putting my gradient shade layer on the same layer as the pic - which I really didn’t want to do, but it’s worth it