A
A
artuh_a2020-05-14 13:26:52
css
artuh_a, 2020-05-14 13:26:52

How to implement similar animation?

Does anyone have any idea how this animation is implemented ?

Excites precisely the algorithm for changing the speed of movement of the cards. The speed is different for everyone, but at the same time, after each scroll cycle, they maintain the same order and indentation in relation to each other. If you make cards just different random speeds, their inevitable sticking occurs. It seems that they have an algorithm for counting, which depends on the position of the card relative to its neighbors.

Answer the question

In order to leave comments, you need to log in

1 answer(s)
S
Stepan Krapivin, 2020-05-14
@artuh_a

This is a four layer parallax effect.
Each layer moves at its own speed.
On each layer, the distance between the cards does not change.
The speed of movement depends on the position of the cursor - the closer to the edge of the screen, the faster the layers move.
The higher the layer, the greater the speed.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question