Featured Animated Social Sharing Bar With JQuery For blogger.

Hello friends now add rounded Animated Sharing Bar With JQuery and CSS . in your blogger post footter easily.

Follow simple atep to adding this cool effect widget in your blogger blog.---->>>> * First go to your blogger Dashboard.
* Now click in design tab and edit HTML.
* Click in small box to expand your blogger template.
* Now find this code </head> by CTRL+F key easily.
* Copy below code and paste before </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

<script src='http://www.yourjavascript.com/5718110189/rotating%20social.js' type='text/javascript'/>

* Now again find this code ]]</b:skin> by CTRL+F KEY
* Copy below code and paste before ]]</b:skin>

#share{

/* The share box container */

width:500px;

background:#ececec;

height:220px;

margin:60px auto;

overflow:hidden;

-moz-border-radius:12px;

-webkit-border-radius:12px;

border-radius:12px;

}

#share-label{

/* The image on the right */

background:url(http://santabanta.mywapblog.com/files/sharelove.png) no-repeat 50% 50%;

float:left;

height:220px;

width:200px;

}

#stage{


position:relative;

border-right:1px solid #DDDDDD;

width:290px;

height:220px;

background:white;

float:left;

border-bottom-left-radius:12px;

border-top-left-radius:12px;

-moz-border-radius-bottomleft:12px;

-moz-border-radius-topleft:12px;

-webkit-border-bottom-left-radius:12px;

-webkit-border-top-left-radius:12px;

}

.btn{


background-color:white;

height:90px;

left:0;

top:0;

width:60px;

position:relative;

margin:20px 0 0 10px;

float:left;

}

.bcontent{


position:absolute;

top:auto;

bottom:20px;

left:0;

}


.digg{ background:url(http://santabanta.mywapblog.com/files/digg-love.png) no-repeat -4px bottom;}

.reddit{ background:url(http://santabanta.mywapblog.com/files/reddit-love.png) no-repeat -4px bottom;}

.facebook{ background:url(http://santabanta.mywapblog.com/files/facebook-love.png) no-repeat bottom center;}

.tweetmeme{ background:url(http://santabanta.mywapblog.com/files/twit-love.png) no-repeat -5px bottom;}

.dzone{ background:url(http://santabanta.mywapblog.com/files/dzone-love.png) no-repeat -7px bottom;}

.thanksto{

position:absolute;

bottom:2px;

right:110px;

font-size:10px;

}

.thanksto a,.thanksto a:visited{

color:#BBB;

}



span.fb_share_no_count {

display:block;

}

span.fb_share_count_top.fb_share_no_count {

line-height:54px;

}

span.fb_share_count_nub_top.fb_share_no_count{

display:none;

}

span.fb_share_no_count span.fb_share_count_inner {

background:#3B5998 url(http://static.fbshare.me/f_only.png) no-repeat scroll 20px 5px;

display:block;

}

* Now Again find this code <data:post.body/> By CTRL+F key.
* Now copy below code and paste after <data:post.body/>

<div id="share">
<div id="stage">

<div class="btn digg"><div class="bcontent"><a class="DiggThisButton"></a><script src="http://digg.com/tools/diggthis.js" type="text/javascript"></script></div></div>
<div class="btn tweetmeme"><div class="bcontent"><script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script></div></div>
<div class="btn dzone"><div class="bcontent"><script language="javascript" src="http://widgets.dzone.com/links/widgets/zoneit.js"></script></div></div>
<div class="btn reddit"><div class="bcontent"><script type="text/javascript" src="http://www.reddit.com/button.js?t=2"></script></div></div>
<div class="btn facebook"><div class="bcontent"><a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script></div></div>
</div>
<div id="share-label">
</div>
</div>

* Now click to save your blogger Template and you are now done.