Half Spinning Social Icons With CSS3 For Blogger

We always try to make something different which will attract our readers/visitors quickly. This widget will surely help you to increase number of social subscribers also it will attract your readers and grabs visitors attention quickly.On mouse hover they spins(rotates) some degrees and when mouse hovers out on it they return to their original position,this effect is caused by the CSS3 property which I have mentioned above.Now lets go to the tutorial and see how to add them into blogger blog.
spinning-icons-for-blogger

How To Add Half Spinning Icons To Blogger ?

<style>p#hb_socialicons img {
-moz-transition: all 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
p#hb_socialicons img:hover {
-moz-transform: rotate(120deg);
-webkit-transform: rotate(120deg);
-o-transform: rotate(120deg);
-ms-transform: rotate(120deg);
transform: rotate(120deg);
}
</style> 
<center><p id="hb_socialicons">
<a href="YOUR-FACEBOOK FAN PAGE-URL GOES HERE">
<img border="0" src="http://3.bp.blogspot.com/-ck0bnvgk5uI/T_fxhb7Ay-I/AAAAAAAACRY/yZR4hu8omnE/s1600/helperblogger.com-facebook.png" /></a>
<a href="YOUR-TWITTER FAN PAGE-URL/USER NAME GOES HERE">
<img border="0" src="http://4.bp.blogspot.com/-P_NkdPIsSQQ/T_fxjUKUF2I/AAAAAAAACRs/KXfA3LnHej8/s1600/helperblogger.com-twitter.png" /></a>
<a href="YOUR GOOGLE PLUS PAGE URL GOES HERE">
<img border="0" src="http://1.bp.blogspot.com/-uSOHwlVeA68/T_fxiHgtoJI/AAAAAAAACRc/-UZ8ujxc7Ic/s1600/helperblogger.com-google_plus.png" /></a>
<a href="YOUR-FEED URL- GOES HERE">
<img border="0" src="http://2.bp.blogspot.com/-2sRpqFhID4A/T_fxipoh7DI/AAAAAAAACRo/kn_qiQKBT-o/s1600/helperblogger.com-rss.png" /></a>
<a href="YOUR YOUTUBE USERNAME GOES HERE">
<img border="0" src="http://3.bp.blogspot.com/-2wY3FQCZgoM/T_fxkMsCqtI/AAAAAAAACR4/jsNUZdVcCCg/s1600/helperblogger.com-youtube.png" /></a>

Note : Highlighted text in the above code should be replaced with the following.
  • YOUR-FACEBOOK FAN PAGE-URL GOES HERE with your Facebook fan Page URL
  • YOUR-TWITTER FAN PAGE-URL/USER NAME GOES HERE with Twitter user name or Fan page
  • YOUR GOOGLE PLUS PAGE URL GOES HERE with Google Plus Profile or Fan Page URL
  • YOUR-FEED URL- GOES HERE with your feed name URL
  • YOUR YOUTUBE USERNAME GOES HERE with your Youtube Username.
If you like this then please subscribe to Our feeds and Like us on Facebook for Future Updates. Thank you.
Follow :
Facebook
Twitter
Google+
Like the post? Never miss another. Get all our posts directly to your e-mail. Subscribe to our newsteller today

0 comments:

Post a Comment

Your feedback is always appreciated. We will try to reply to your queries as soon as time allows.
Note:
1) Do not include links in comments as they will not be published after moderation !
2) Make sure that you "subscribe by mail" to get notified to reply to your comments.
3) Please do not Spam... Spam comments will be deleted immediately upon our review.

Proudly powered by Blogger