i am trying to build an mechanic that moves the whole page just al little bit out from the top. that works, but i have a problem with the z-index.
i want the menu button (white square) to stay behind the first div area. this also works, but after the interaction (click on the 1. div container), the menu button comes to the front.
does smn. have an idea, why the menu button comes to the front?
Z-INDEX really work when you assign them to elements that are at the same level. It’s very important. So you have several levels of z-indexes working together, possibly.
So, for instance, if I put your square into the wrapper, it’s at the same level than your sec1, and it works, it stays under when you play the interaction.
Most of the time when you have sites with flickering involved when there’s motion, it’s because the z-indexes are placed funky. When you do motion design with CSS, the html structure has to be thought with the layers in mind, and the z properties set on layers at the same level. Here, if you want the square to be outside the wrapper, you’ll have to rethink your structure, because I guess the interaction affects the wrapper element…