How to handle the scroll event with animation in each monent's state?

Question

I want to do a scroll event animation, here is the steps:

1. A card element(div&img, let\'s named it CARD) in the middle of screen;
2. Do scroll down;