How to ensure that the snake-like animation in
https://codepen.io/TobiReif/pen/b7809c58663ddac3572f5594ffc4f5fe/
is even?
Each column of dots should move up with ease-in-and-ease-out (eg sine) and should move back in the same way:
slow upwards, fast upwards, slow upwards, then slow downwards, fast downwards, slow downwards; loop.
The current animation is roughly what I want, but it seems to be faster at the top and slower at the bottom. Each column of dots seems to jump up and down, resting at the bottom only.
I had no luck using repeatDelay, and I think a clean solution would not involve repeatDelay. Instead I need something like "sineAnimationUp;reverse;loop" or simply "sineWaveAnimation" == forth and back exactly like a sine wave.