How to make a correct parallax?

  • 0
    The second day I am thinking how to write a smooth parallax for vertical scrolling. There are two blocks, one below the other above as in the picture. As you scroll the page, you need to make block 2 tranlateY - 200px, and block 1, respectively, by + 200px, and vice versa when scrolling back. Basically, I would like to understand what to calculate from what, how it works in general.

    JavaScript Caleb Bradshaw, Apr 21, 2020

  • 2 Answers
  • 0
    A self-written solution on the knee looks something like this:



    There are also ready-made libraries for this:

    https://dixonandmoe.com/rellax/

    https://locomotivemtl.github.io/locomotive-scroll/
    Anonymous

  • 0
    https://learn.javascript.com/onscroll



    Here ^ in sufficient detail! :)
    Anonymous

Your Answer
To place the code, please use CodePen or similar tool. Thanks you!