016
Swirling images
In this effect, we will make images appear from outside the screen and move toward the center. The movement will follow a spiral pattern and progress as the user scrolls. Let’s get started!
HTML Structure
The container will remain pinned throughout the height of the pin-height division. Each image will be wrapped inside a media-wrapper division, which will handle the rotation.
<div class="pin-height">
<div class="container">
<div class="media-wrapper">
<img class="media" src="./assets/medias/1.jpg">
</div>
<div class="media-wrapper">
<img class="media" src="./assets/medias/2.jpg">
</div>
...
</div>
</div>