Skip to content Skip to sidebar Skip to footer

How to Add a Spinning and Zoom Hover Effect to Photos


Go to Edit > HTML Mode > Code Postings Put the following code where you want it.

HTML

<div id="effect">
<img src="yourphoto.jpg"/>
</div>

CSS

#effect img {
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}
#effect img:hover {
    -o-transform: scale(2) rotate(360deg);
    -moz-transform: scale(2) rotate(360deg);
    -webkit-transform: scale(2) rotate(360deg);
    transform: scale(2) rotate(360deg);
}

DEMO

Post a Comment for "How to Add a Spinning and Zoom Hover Effect to Photos"