
In this tutorial I’ll give you a quick run down of how to go about creating this slide in effect.There are a few things we want to accomplish. The code I provide below is just a quick roundup of how this effect is accomplishable. I do plan to turn this into a plugin at a later date with a much wider breadth of applicability.
- Firstly we must generate the ‘slices’ in Javascript. This will be determined by screen width and will have to change as the user resizes their window.
- Next we need the slices to slide in. We can do this with animations, but we don’t want the animations to queue in such a way that it ruins the effect
- We want the slices to reset when another animation comes on top of it.
- The slices should be positioned absolutely so content can be placed on top if it.