How to rotate/spin an image on hover using CSS3

by adesignguy Posted on 25/01/2016 22:10:50 | Category: CodeShare

Ever wondered how to spin an image on hover? It's easy! First add the CSS below to your stylesheet CSS and then add the class "spin" to an image you want to spin, for instance, a social media logo. Job done! Remember this effect only works on browsers supporting CSS3 effects

CSS:

.spin {
    overflow: hidden;
    transition-duration: 0.8s;
    transition-property: transform;
}
.spin:hover {
    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
}