Memasang Shoutbox Melayang

Sidebar sudah penuh dengan Widget tapi shoutbox belum terpasang,nich solusinya.dengan shoutbox melayang ini kamu tetep bisa pasang shoutbox.selain itu juga dapat mempercantik tampilan blog kamu.jadi kalau kita ingin menggunakan shoutbox itu kita tinggal klik gambar PESAN tersebut ,maka shoutbox akan muncul dan bisa digunakan semestinya.

untuk contohnya bisa dilihat disamping kanan blog saya ini.

OK, Langsung saja menuju target. . .


caranya…pertama kamu copy dulu kode dibawah ini…, kemudian pastekan pada ( blogspot )…Tambah Gadget >>> Html/Javascript
Ini codenya….

<style type="text/css">
#nempel{position:fixed;top:65px;z-index:+1000;}
* html #nempel{position:relative;}
.nempeltab{height:100px;width:30px;float:left;cursor:pointer;background: #A5BD51 url('http://lh5.ggpht.com/_xcD4JK_dIjU/Stq23DPOQUI/AAAAAAAADhQ/2imPnFpVUrA/d/floatnav.jpg')no-repeat;}
.nempelisi{float:left;border:2px solid #A5BD51;background:#CCFFFF;padding:8px;}
</style>
<script type="text/javascript">function showHideNempel(){var nempel =document.getElementById("nempel");var w = nempel.offsetWidth;nempel.opened ? moveNempel(0, 30-w) : moveNempel(20-w, 0);nempel.opened = !nempel.opened;}function moveNempel(x0, xf){var nempel = document.getElementById("nempel");var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1;var x = x0 + dx * dir;nempel.style.right = x.toString() + "px";if(x0!=xf){setTimeout("moveNempel("+x+", "+xf+")", 10);}}</script>
<div id="nempel">
<div class="nempeltab" onclick="showHideNempel()"></div>
<div class="nempelisi">

<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe scrolling="auto" width="250" frameborder="0" src="http://www6.shoutmix.com/?m4rlif" height="350" title="m4rlif">
<a href="http://www6.shoutmix.com/?m4rlif">View shoutbox</a>
</iframe>
<br/><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br/>
<!-- End ShoutMix -->

<div style="text-align:right;"><a style="text-decoration:none; font-family:Arial, Helvetica, sans-serif; font-size: 12px;" href="javascript:showHideNempel()">[Close]</a></div>
</div>
</div>
<script type="text/javascript">var nempel =document.getElementById("nempel");nempel.style.right = (30-nempel.offsetWidth).toString() + "px";</script>

Keterangan: Untuk yang warna hijau kamu ganti dengan kode shoutbox kamu sendiri.

sedah jelaskan,kalau belum jelas dibaca secara cermat lagi yach.hehehe,,,,,,,,,,
OK, selamat mencoba 

Artikel Terkait