043
Soloing images
In this effect, we will make a set of cards appear when a section crosses the viewport. The movement will follow a fictional curved path, eventually forming a fan. To fully view each card, the user just needs to hover over it. Shall we take a look? Let’s go!
HTML Structure
The structure here is quite simple. Each card will be positioned in a large division. These divisions will rotate to form the fan. They will be contained within the container.
<section class="mwg_effect043">
<div class="container">
<div class="card-wrapper">
<img class="card" src="./assets/medias/1.png" />
</div>
<div class="card-wrapper">
<img class="card" src="./assets/medias/2.png" />
</div>
...
</div>
</section>