Calculator on Squarespace 7.0 & 7.1 website || jishaansinghal Video: https://youtu.be/zrN86OpUlK8 Contact Us: https://fiverr.com/s/8zBlpLr #calculator, #calculatoronsquarespace, #squarespace, #jishaansinghal,#css,#html,#js,#jquery,#squarespacewebsite,#customcode

Image
Calculator on Squarespace 7.0 & 7.1 website || jishaansinghal Video: https://youtu.be/zrN86OpUlK8 Contact Us: https://fiverr.com/s/8zBlpLr #calculator , #calculatoronsquarespace , #squarespace , #jishaansinghal , #css , #html , #js , #jquery , #squarespacewebsite , #customcode

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;

}


}

Comments

Popular posts from this blog

how to add a button as a circle button on the Squarespace by jishaansinghal

How to add Vector Scrolling GSAP animation Effects on your Squarespace Website in 2022 with full source code by jishaansinghal

How to install and use owl carousel mousewheel animation slider with full source code by jishaansinghal 2022