Skip to content

CSS: Animate with CSS Only

this example css code, to perform animate like jQuery, but without any js code, but following code works on modern browser only

 

<style>

.theBox {

 

-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;

 

background: red;

width:100px;

height:50px;

 

}

 

.theBox:hover{

width:200px;

}

</style>

 

<div class=”theBox”></div>

Share

Be First to Comment

Leave a Reply

Your email address will not be published. Required fields are marked *

Time limit is exhausted. Please reload CAPTCHA.