Panel Masking

[soupking]

Hi GS, (and Happy New Year!)

 

Do I have this all wrong or is the proper way to unmask an expanding panel is to shift the container div 100px left while shifting the underlaying contents -100px the other direction? 

 

Is that how people animate an expansion? I haven't done this since the Flash days and I can't post a CodePen as the code I have is really involved and wouldn't translate. 

 

I feel like I'm doing a whole lot of plus/minus work with a number of elements and before I keep getting this straight would like to know if this is a good use of time and/or if somebody might have an example of what they'e done.

 

Thanks so much for your time. 

 

See the Pen by (@) on CodePen

[ZachSaucier]

Hey soupking.

 

It's really hard to say whether or not that's the correct approach without any visualization at all. I am not certain I understand exactly what the situation is. Moving one thing one way while moving another thing the other way (if you're using DOM elements using transform is a good idea) seems like a fine approach. It depends on the setup and needs. 

 

In terms of doing calculations, I'm guessing you could make it easier using variables and functions but can't say for sure as you haven't provided any code either.