JQuery animated share button

Untuk memasang JQuery animated share button pada blog seperti yang boleh anda lihat di bahagian sidebar blog ini, hanya iku beberpa langkah yang mudah di bawah.

Langkah 1

Log in blog => Dashboard => Page Element => Add A Gadget => HTML/Javascript.

Langkah 2

Salin kod biru di bawah dan paste pada ruang content HTML/Javascrpit(rujuk gambar di bawah) dan Save.


<style>
#stage{

position:relative;
width:110%;
height:140px;
padding-left:15px;
background:transparent;
}

.btn{

background:transparent;
height:90px;
left:0;
top:0;
width:20px;
position:relative;
margin:20px 0 0 0px;
float:left;
}

.bcontent{

position:absolute;
top:auto;
bottom:20px;
left:0;
}

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;
}
</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://sites.google.com/site/jquery01/script.js"></script>

<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>

6 comments.. read them below or add one

Fyzal Fyzal 12:37 PM
bro.. tak berat ke benda ni. sebab aku rasa bila nak scroll blog ko ni, die cam lagging sikit.
Nescafe ais Nescafe ais 12:46 PM
@Fyzal

Rasanya memang berat juga sebab yang lima icon tu guna js. Kalau ganti guna icon biasa rasanya ok sikit agaknya. Aku belum cuba lagi.

Terima kasih atas makluman.hehe
Limza ® Limza ® 1:22 PM
ilmu yang beguna , tq :)
iza iza 4:24 PM
Singgah membaca je.....ilmu berguna tp matlamat aku nk ringankan blog :)
HaFizRahMaN.com HaFizRahMaN.com 10:16 PM
wah...baru ingt nak tanye pasal tue...thanx bro....bayk membantu