ANIMATED FOLLOW-US WIDGET FOR BLOGS.

 On Minggu, 16 September 2012  

Have you ever wondered if it's really possible to have an animated widget?...

If yes,then I'm glad to introduce to you this animated 3D[three dimension] FOLLOW-US widget which can easily catch the attention of your blog visitors.

It was designed in form of a square which rises and changes from gray to a stupefying color when hovered upon.

To add this widget in your blog,here's what you need do →
Login to Blogger,then go to Design » Page element and select 'Add a gadget'.
Now,locate "HTML/JAVASCRIPT" and select ADD.
Just copy/paste the code below and save the widget.

<style>.blogtoolz-flt-wdt{position:fixed; right:10px; top:36%;}
.blogtoolz-flt-wdtimg {float:right; clear:right; margin:1px; -webkit-transition:all .0s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition:all .2s ease-in-out; transition: all .2s ease-in-out;}
.blogtoolz-flt-wdt img:hover{-moz-transform:scale(1.2) rotate(6deg);-webkit-transform: scale(1.2) rotate(6deg);-o-transform: scale(1.2) rotate(6deg); -ms-transform: scale(1.2) rotate(6deg); transform: scale(1.2) rotate(6deg);}</style>
<div>
<style>
.BlogToolz1{display: block;width:64px;height: 64px;background:url('http://i1269.photobucket.com/albums/jj591/aditya9172/facebook_rollout_64x64.png') bottom; text-indent:-99999px;}
.BlogToolz1:hover{background:url('http://i1269.photobucket.com/albums/jj591/aditya9172/facebook_color_64x64.png')bottom; height: 64px;}
</style>
<a href="Your Facebook Link Here"></a>
<style>
.BlogToolz2{display:block;width:64px;height:64px;background:url('http://i1269.photobucket.com/albums/jj591/aditya9172/twitterl_rollout_64x64.png') bottom;text-indent:-99999px;} .BlogToolz2:hover{background:url('http://i1269.photobucket.com/albums/jj591/aditya9172/twitter_color_64x64.png') bottom; height: 64px;}
</style>
<a href="Your Twitter Link Here"></a>
<style>
.BlogToolz3{display:block;width:64px;height:64px;background:url('http://i1269.photobucket.com/albums/jj591/aditya9172/feed_rollout_64x64.png') bottom;text-indent: -99999px;}
.BlogToolz3:hover{background:url('http://i1269.photobucket.com/albums/jj591/aditya9172/feed_color_64x64.png') bottom; height:64px;}
</style>
<a href="Your Rss Feed Link Here"></a>
<style>
.BlogToolz4{display:block;width:64px;height:64px;background:url('http://i1269.photobucket.com/albums/jj591/aditya9172/google_rollout_64x64.png')bottom;text-indent: -99999px;}
.BlogToolz4:hover{background:url('http://i1269.photobucket.com/albums/jj591/aditya9172/google_color_64x64.png') bottom; height: 64px;}
</style>
<a href="Your Google Plus Link Here"></a> </div>
<!-- Animation widget ends -->

That's it.Just replace the necessary things there i.e the blue texts and save the widget.

ANIMATED FOLLOW-US WIDGET FOR BLOGS. 4.5 5 Unknown Minggu, 16 September 2012 Have you ever wondered if it's really possible to have an animated widget?... If yes,then I'm glad to introduce to you this animated...


Related Post:

  • STYLISH OPEN-HEART BOOKMARKING WIDGET/GADGET FOR BLOGSPOT.This is one of the best bookmarking widget I've come across.The bookmarking widget is made in form of heartlike seen in the image above,and whenever you mouse hover it,the heart slides open and several bookmarking buttons such as facebook,twitter,lin… Read More
  • CSS RELATED POST WIDGET.In one of my previous posts,I gave out a site to add the "Related post widget" to your blog,but for those who might prefer to embed the codes into their template,this is a nice way of doing that.HOW TO ADD THE WIDGET ON YOUR BLOG.First,login to your … Read More
  • PAGE NAVIGATION/PAGINATION FOR BLOGGER BLOGS.Page Pagination/navigation widget is a very useful widget every blog should have.The widget replaces blogger default 'next','previous' and 'home' link at the buttom of every post.Likewise,it makes your blog look more professional.HOW TO ADD THE PAGIN… Read More
  • GOOGLE +1 BUTTON FOR BLOGS.As we all know,'google +1' button is one of the essential buttons a blog should have to become more popular.This button is similar to facebook & twitter send buttons.HOW TO ADD THE BUTTON TO YOUR BLOG.To add this button,just follow the steps below ca… Read More
  • SOCIAL SHARING WIDGET FOR BLOGSPOT.Previously,I wrote on how to add stylishopen heart bookmarking widget on blogger& today,I'll be giving some cool sharing widget to integrate on your blog.This widget contains: facebook,twitter,digg,stumble linkedin and technorati buttons which will a… Read More

Tidak ada komentar:

Posting Komentar