In this effect, we will rotate the images of a grid based on the cursor's position. Each image will be oriented directly towards the cursor. The farther an image is from the cursor, the more amplified its rotation will be. 3, 2, 1—let’s go!
HTML Structure
The structure here is extremely simple. We simply call all the images we want to use for our effect.
<div class="container">
<img class="media" src="./assets/medias/01.png" alt="">
<img class="media" src="./assets/medias/02.png" alt="">
<img class="media" src="./assets/medias/03.png" alt="">
...
</div>