다층 이미지 시차 순수 CSS

Question

3 이미지가 있습니다. 첫 번째 이미지는 투명한 태양 이미지이고 두 번째 이미지는 투명하고 세 번째는 인간 캐릭터입니다 (투명).

첫 번째 이미지는 깊은 뒷면에 있어야하지만 움직여야합니다. 두 번째 이미지는 이미지 뒤에 숨어있을 수 있도록 두 번째 이미지를 고정해야하며 스크롤 할 때 태양이 산에서 뒤로 올라가는 것처럼 보입니다. 세 번째 이미지 - 전경에 있어야하며 스크롤하는 동안 아래에서 위로 이동해야합니다.

이미지를 조정할 수 없습니다.

Answer 1

주먹 모두는 부모 div 위치를 상대적으로 만들고 자녀 위치를 절대 위치로 만듭니다. 이제 위쪽, 왼쪽, 오른쪽, 아래쪽을 사용하여 위치를 지정하십시오.