Advanced Image Animation With HTML & CSS in 2022 with full source code | jishaansinghal

 HTML:

<img class="anim" src="Penguins.jpg" alt="img">

CSS:

body{

margin: 0;

padding: 0;

height: 100vh;

width: 100%;

overflow: hidden;

}

.anim{

animation: anim 5s ease-out both;

}

@keyframes anim {

0%{

transform: scale(1.0) translateY(0);

transform-origin: 100% 100%;

}

100%{

transform: scale(1.3) translateY(-20px);

transform-origin: top;

}

}