Make your site logo interactive with css3

Using css3 and Html5, logo of your site can be made interactive. Add following css3 code to your your css file . This code will make logo image rotate by 10 degree whenever mover is hovered over logo image. If ID of your logo is “logo” then code will be :

#logo img
 -webkit-transition-property: -webkit-transform;

-moz-transition-property: -moz-transform;

-o-transition-property: -o-transform;

transition-property: transform;

-webkit-transition-duration: 0.9s;

-moz-transition-duration: 0.9s;

-o-transition-duration: 0.9s;

transition-duration: 0.9s;



#logo img:hover



Join The Geek Side

Recommend on Google