I'm trying to facilitate a view transition where one large container component slides in from one side while the other slides out to the other.
I can get all of the discrete animations to work no problem with react motion, however, I'm at a loss as to how to handle both simultaneously.
Essentially, there is a point where both components inhabit the viewport simultaneously. I feel like my knowledge of CSS layout is inadequate to handle the problem properly.
My initial idea is to have the sliding elements absolutely positioned inside a relatively positioned container. However, this absolute positioning has side effects with respect to all the components contained inside of the absolutely positioned container.
This is a solved problem (iOS views slide back and forth all the time and retain layout behaviour when they pop into the view port).
If anyone could point me to a good resource for understanding this problem, or give me some general advice it would be appreciated. My main problem is that I don't know what topics to research or what books/online resources are good for explaining the solution to this type of problem.
