blogging cara membuat blog

Membuat Floating Chatbox Hide and Show !

17:42 Ardiya

Mau tahu cara membuat widget Chatbox seperti punya saya inilah caranya : Caranya:
Copykan Script dibawah ke : Buka Layout - Page Element dan Klik add gadget - Lalu pilih HTML/JavaScript.


<style type="text/css">

.gb_fixed{
position:fixed;
top:60px; 
right:0px;
z-index:+10;
}

* html .gb_fixed {position:relative;}
#hidden_gb2 {
display:none;
border:0px solid gray;
background:transparent;
padding:10px;
padding-top:0px;
}
</style>
<div class="gb_fixed">
<table cellpadding="0" cellspacing="0" id="hidden_gb2"><tbody>
<tr><td>
<div>
<a href="javascript:void(0)" onclick="gb_showHideGB()"><img src="https://www.bookonthenet.net/east/RKEres/Images/CloseButtonHot.bmp" /></a>
<span style="font-size: 80%;">
<span class="Apple-style-span" style="color: white;"> Get this</span>
<a href="http://www.m-azka.com/2011/02/cara-membuat-chat-kotak-chatting.html" target="_blank">
<span class="Apple-style-span" style="color: orange;"> Widget</span>
</a>
<span class="Apple-style-span" style="color: white;"> and</span>
<a href="http://www.m-azka.com/2011/04/membuat-floating-widget-chatbox.html" target="_blank">
<span class="Apple-style-span" style="color: orange;"> Desaign!</span></a></span></div>

Masukan Script yang kamu inginkan disini! Misal: kode Shoutmix, Adsense, Sponsor. 

</td></tr>
</tbody></table>
</div>

<script src="http://marewainfo.googlecode.com/files/ordinaryhack-floating.js">
</script>
<div class="gb_fixed" style="z-index: +5;">
<a href="javascript:void(0)" onclick="gb_showHideGB()">
<img border="0" src="http://4.bp.blogspot.com/_GmDoFC87tnc/S9mFQhSm5PI/AAAAAAAAAfM/CermeFfIask/s1600/cbred.png" style="filter: alpha(opacity=60); opacity: 0.6;" />
</a> </div>

Tambahan tombol saat membuka chatbox:
Berikut ini adalah icon hidden chatbox dan warna border yang serasi dan bisa anda gunakan dalam hidden chatbox anda ,


URL Gambarhttp://1.bp.blogspot.com/_GmDoFC87tnc/S9mFSX2I_qI/AAAAAAAAAfs/60n9Gquxt6o/s1600/cbblue-2.png
Warna border #0079a0


URL Gambarhttp://3.bp.blogspot.com/_GmDoFC87tnc/S9mFR0N8DLI/AAAAAAAAAfk/HRgxuRNSsWk/s1600/cbblue.png
Warna border #003e82


URL Gambarhttp://1.bp.blogspot.com/_GmDoFC87tnc/S9mFRucX-HI/AAAAAAAAAfc/WmswhSn7reM/s1600/cbgreen.png
Warna border #008232






URL Gambarhttp://3.bp.blogspot.com/_GmDoFC87tnc/S9mFROZPMBI/AAAAAAAAAfU/e0Qb4B7Gr_I/s1600/cbyellow.png
Warna border #aca500


URL Gambarhttp://4.bp.blogspot.com/_GmDoFC87tnc/S9mFQhSm5PI/AAAAAAAAAfM/CermeFfIask/s1600/cbred.png
Warna border #790909


Sumber:http://www.m-azka.com/2011/04/membuat-floating-widget-chatbox.html
Related Posts Plugin for WordPress, Blogger...
Related Posts Plugin for WordPress, Blogger...

You Might Also Like

1 comments

boleh komen ,asal pakai hati ya...dan blog ini sudah dofollow

note:blog ini tidak membatasi orang yang berkomentar dengan nama Anonymous, seperti blog yang lain,jadi silahkan berkomentar sesuka hati ..!

Popular Posts

Contact Form