Cara memasang chat box show and hide

Menurut saya chat box sangat penting untuk sekedar komentar ataupun ngobrol-ngobrol dengan pengunjung blog kita..bahkan di forum pun chat box banyak di gunakan,biasanya chatbox di pasang di samping postingan blog atau di bawah,tapi kurang efektif karena makan tempat.Kali ini saya akan memberi tips bagaimana cara memasang chat box slide and show,yang pastinya gk "mantep" alias makan tempat ^_^...
ok lanjut,,pastikan kamu sudah terdaftar di shoutmix atau chatbox lainnya,setelah itu kamu copy code hide and shownya

<style type="text/css"> #hitsukeFX{ position:fixed; top:50px; z-index:+1000; } * html #hitsukeFX{position:relative;} .hitsukeFXtab{ height:550px; width:35px; float:left; cursor:pointer; background:url('http://i642.photobucket.com/albums/uu147/remoxp/Chatbox.png') no-repeat; } .hitsukeFXcontent{ float:left; border:2px solid #ffffff; -moz-border-radius-topleft:5px; -moz-border-radius-topright:5px; -moz-border-radius-bottomleft:5px; -moz-border-radius-bottomright:5px; background:#000000; padding:10px; } </style> <script type="text/javascript"> function showHidehitsukeFX(){ var hitsukeFX = document.getElementById("hitsukeFX"); var w = hitsukeFX.offsetWidth; hitsukeFX.opened ? movehitsukeFX(0, 40-w) : movehitsukeFX(40-w, 0); hitsukeFX.opened = !hitsukeFX.opened; } function movehitsukeFX(x0, xf){ var hitsukeFX = document.getElementById("hitsukeFX"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; hitsukeFX.style.right = x.toString() + "px"; if(x0!=xf){setTimeout("movehitsukeFX("+x+", "+xf+")", 10);} } </script> <div id="hitsukeFX"> <div class="hitsukeFXtab" onclick="showHidehitsukeFX()"> </div> <div class="hitsukeFXcontent">

>>MASUKAN CODE CHAT BOX KAMU<<

<div style="text-align:right"> <a href="javascript:showHidehitsukeFX()"> [hide] </a> </div> </div> </div> <script type="text/javascript"> var hitsukeFX = document.getElementById("hitsukeFX"); hitsukeFX.style.right = (40-hitsukeFX.offsetWidth).toString() + "px"; </script>

selesai..tinggal pastekan di HTML/JavaScript,udah tau kan cara nya..
klo belum tau ikuti cara-caranya.

RANCANGAN >> TAMBAH GADGET >> Pilih HTML/JavaScript >> lalu COPAS code di atas.
semoga berhasil... ^_^

Artikel Terkait