How to show an element on scroll up?

Question

JavaScript

Good afternoon!

Please tell me how to make the animation when scrolling from bottom to top.

The essence of the animation itself is as follows: when scrolling down, the first picture is displayed, then, moving further, it is removed and the second picture appears. Returning up, the opposite principle works: the second picture, then it is removed and the first picture is displayed.

Help, please, deal with the issue.

Thanks in advance.

*
Answer here: https://jsfiddle.net/ad0ozwda/39/

Answer 1

Answer here: https://jsfiddle.net/ad0ozwda/39/

Answer 2

Of course, it does not work - everything is red in your console.