aCodeMonkey
New member
All,
I'm developing a circular carousel of cards that uses JavaScript to control the animation.
The carousel animates correctly for the first left or right card click. Afterwards, the grid containing the individual cards does not rotate to the correct new position. This throws off the cards' orientation and breaks the JavaScript - Web Animation API logic.
Carousel and card animation positions are stored in the element's data attributes and are being updated correctly on the every click events.
Could someone to take a look and let me know where my logic has lead me down this dark path.
I've uploaded a sample of the code on Code Pen
I'm developing a circular carousel of cards that uses JavaScript to control the animation.
The carousel animates correctly for the first left or right card click. Afterwards, the grid containing the individual cards does not rotate to the correct new position. This throws off the cards' orientation and breaks the JavaScript - Web Animation API logic.
Carousel and card animation positions are stored in the element's data attributes and are being updated correctly on the every click events.
Could someone to take a look and let me know where my logic has lead me down this dark path.
I've uploaded a sample of the code on Code Pen
Last edited: