I'm trying to solve a problem where, when scrolling, I have three cards separated by 100px, one below the other, inside a wrapper div with the class: wrapper-cards. The three cards are all within this div, and everything is relative. What I'm trying to do is, when scrolling, the first card, initially hidden at the top, should move down as I scroll. As I scroll down, the second card, hidden on the left, should reappear, and finally, the third card, hidden on the right, should reappear. The point is that these three cards shouldn't return to their initial positions; they should only reappear once unless the page refreshes. But this isn't working for me!