The FLIP technique allows us to easily animate these impossible things. In HTML-land every element is neatly placed on one grid and really easy to move around responsively. The basic premise is: Grab the initial position of the elements involved in the transition. Move the elements and grab the final position.

13m read timeFrom css-tricks.com
Post cover image
Table of contents
How will this animation be used?Fluid animationTargeted animationThinking outside of the box, beyond screen sizesScrollTrigger tipsBonus GSAP nerd tip!Motion principlesAddendum

Sort: