Hover Effect vs Animation

Hey,

I got a problem with a Hover Effect and an animation in the same section. I created a parallax effect for the headline “UNSER TEAM”. Its working fine. Then I tried to create small effects when you hover over the pictures in that section. This works too. But as you can see on the last two pictures (last one doesn’t have a hover effect for showcasing), the pictures, as soon they have have a hover effect, are in front of my headline. But I want the headline in front of the pictures. In the preview, everything seems correct (sometimes) but on my published version, my problem appears every time.

Can anyone help me? Im using webflow since yesterday :smiley:

THANK YOU!

https://preview.webflow.com/preview/timos-fabulous-site-0cb39-5529d4232ae8b?utm_medium=preview_link&utm_source=designer&utm_content=timos-fabulous-site-0cb39-5529d4232ae8b&preview=88c2be9abe5c6ebedbd1a6814f663cf4&workflow=preview

https://timos-fabulous-site-0cb39-5529d4232ae8b.webflow.io

Hey @WTimo,

welcome to the Webflow family and forum! :slight_smile:

The whole thing has nothing to do with your hover or your parallax interaction, nor with Webflow in particular. This is about the correct positioning.

Your images are set to position: relative;, while your Heading 2 is set to position: static;, so the heading is behind/below the images in the visual hierarchy. Set your Heading 2 to position: relative; and increase the z-index to e.g. 2.
This should already help.

For a better understanding check out the great video from Webflow University on positioning on the web.

Otherwise, you are also welcome to join the German Webflow community on Facebook and/or Discord.

Beste Grüße

Dennis

In Germany we would say: wieder was gelernt! :slight_smile:

thank you!