[need help] simple slot machine with 1 reel
Hello!
I'm new to JS and GSAP.
Could you give me an advice, how to create a very simple slot-machine with one reel.
My machine has 20 boxes, hidden overflow and must spin from up to down.
When I write simple gsap.to(".machine__box", {y: 2000, duration: 2}); I press start button and my 1-3 boxes just move down and disappear with other 17 boxes (I need to set 17-20 boxes behind 1-3, in order to create loop, but idk how to).
I think this thread may help you:
And here's another approach with a helper function I just whipped up for you:
// speed can be positive or negative (in pixels per second)
function verticalLoop(elements, speed) {
elements = gsap.utils.toArray(elements);
let firstBounds = elements[0].getBoundingClientRect(),
lastBounds = elements[elements.length - 1].getBoundingClientRect(),
top = firstBounds.top - firstBounds.height - Math.abs(elements[1].getBoundingClientRect()
