In an effort to speed things up on our site, we decided to remove the standard social media widgets for Facebook and Twitter which have to request data from the sites before they display. We wanted to place some images that simply link to our profiles but desired some more impact with the way they worked. So we put a cool spin effect to them that will make them rotate 360 degrees on hover. You can hover over the images below and see how it works. This has been tested in all major current browser versions.

[column lg=”6″ md=”12″ sm=”12″ xs=”12″ ]

Like WP Fix It on Facebook

[column lg=”6″ md=”12″ sm=”12″ xs=”12″ ]

Follow WP Fix It on Twitter


The CSS: (adjust 360 to any degree to change the rotation)
Add the below CSS to your theme’s style.css file.

a#rotator img {
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out; 
-o-transition: all 1s ease-in-out; 
-ms-transition: all 1s ease-in-out; 

a#rotator img:hover { 
-webkit-transform: rotate(360deg); 
-moz-transform: rotate(360deg); 
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg); 

How it works:
Simply add id=”rotator” to any image link. See example below.

<a id="rotator" href="URL" ><img src="IMAGE_URL"></a>