Home » , » JQuery animated share button

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>
Share this post :

+ comments + 6 comments

12:37 PM

bro.. tak berat ke benda ni. sebab aku rasa bila nak scroll blog ko ni, die cam lagging sikit.

@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

ilmu yang beguna , tq :)

4:24 PM

Singgah membaca je.....ilmu berguna tp matlamat aku nk ringankan blog :)

wah...baru ingt nak tanye pasal tue...thanx bro....bayk membantu

terima kasih

Post a Comment

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. cara buat | bina blog | tutorial | panduan blogspot | blogger info | tips - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger