Using CSS and JS make a small, scalable deck of cards that move around the page in sequence
The cards must obey the laws of physics. They should not change order or position in a way that would not be possible with an ordinary deck of cards.
Concepts used
SCSS-arrays, SCSS-loops, nth-child selectors, SCSS-variables and calculations
CSS Transform, transition and the predefined Bezier-curve settings
The JS setTimeout() function
Problems encountered
It was difficult at first to understand and apply the SCSS loop
There were many calculations involved to achieve the correct x-offsets of the cards (to achieve the 3d/stacking effect).
This was difficult to visualise and a lot of trial and error occurred before I got it to work