Celoteh Sang Galang

Blog Tempat Berbagi Tips dan Trik Dunia Blogger
English French German Spain Italian Dutch Russian Brazil Japanese Korean Arabic Chinese Simplified
Celoteh Sang Galang
Hanya Sebuah Catatan...

Cara Membuat Buku Tamu Show/Hide dari Atas

Posted by Galang 7 April 2011
Daftar Sekarang Bonus $10 langsung dari PROFITCLICKING


Kali ini saya akan membagi tips dan trik "Cara Membuat Buku Tamu Show/Hide dari Atas".  Gak Pake Lama langsung aja Dach...

  1. Login blogger
  2. Rancangan, Tambah GadgetHtml/java script
  3. Dan Simpan kode berikut  : 
Kode Script
<style type="text/css">
#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:2px solid #999;
background: #000;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:10px;
-moz-box-shadow: 0px 2px 5px 0px #f8f9b9;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style="background:#000;">


<!-- Simpan Kode cbox atau shoutmix nya disini -->


</div>
</div>

<br />
<div align="right"><a href="javascript:void(0);" onclick="showHideAT()"><img border="0" src="https://lh5.googleusercontent.com/-r1i4MbA737M/TXe_geYYU9I/AAAAAAAAB5A/PgOy7-VjLAE/s1600/close.png" alt="close" title="Click here to Close Cbox" /></a></div>

</div></div>


<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script>

<center><a href="javascript:void(0);"onclick="showHideAT()"/><img border="0" src="http://i763.photobucket.com/albums/xx277/gberandal/celoteh%20galang/GUESTBOOK.png" alt="cbox" title="Click here to open Guest Book" /></a></center>

Catatan:
Jika ingin menampilkan posisi Tombol di samping seperti Blog saya ini, Tinggal ganti Kode di bawah ini
<center><a href="javascript:void(0);"onclick="showHideAT()"/><img border="0" src="http://i763.photobucket.com/albums/xx277/gberandal/celoteh%20galang/GUESTBOOK.png" alt="cbox" title="Click here to open Guest Book" /></a></center>

Dengan Kode di bawah ini
<div style='display:scroll; position:fixed; top:20px; right:0px;'><a href="javascript:void(0);"onclick="showHideAT()"/><img src="http://i763.photobucket.com/albums/xx277/gberandal/celoteh%20galang/CHATBOX.png"  /></a>
</div>

Sekian Terima Kasih...

GET UPDATE ARTIKEL MENARIK CELOTEH GALANG
Dapatkan kiriman artikel terbaru langsung ke email anda!

Artikel Terkait:

  1. nice trik sob..thanks ya dh sharing..hhe..jangan lupa jga komentar balik di blogku ya sobat

     
  2. dedy Says:
  3. soutboxnya mana gan?
    ane ki$$ ya :D

     
  4. cucuharis Says:
  5. Salut
    Beragi memang indah
    Terima kasih ya sob :)

     
  6. Salam sahabat
    Bagus dan memberikan informadi bagi saya jadi lebih diharuskan untuk memahami kode kode yang ada
    Oh iya dah saya follow thanks ya

     
  7. Denny Langit Says:
  8. FOLLOW BACK GAN GALANG..

     
  9. hahah okey,,mksh sob infonya,,,ttrick ini udah nacep di blog saya :)

     
  10. BlackCyber Says:
  11. kk kalao bikin chatbox yang ada backgroundnya kea apa caranya kk mohon di kasihtau caranya....


    and FOLLOW BACK

     
  12. aden09 Says:
  13. mantap gan,,,, ane dah pasang,,,cek dimari, thx ya gan. ^^

     
  14. nanya nie gan'
    gimana ya klo show hide na dri bawah???kya chat facebook gtu" hehehe
    thank dlu infox. :)

     
  15. Eko Muryanto Says:
  16. Makasih Mas, ini sangat membantu saya..maklum masih pemula...heheh

     
  17. thanks gan dah beri ilmunya.. :)
    ijin copas yah,
    maklum masih newbie

     
  18. Galang Says:
  19. @husni_fadillah:ok copas aja asal kasih link sumbernya aja...

     
  20. Chiiicah Says:
  21. keren,,, cara ganti smiliesnya gimana?? kayak yg di blog ini, soalnya lucu

     
  22. Ade Eka Says:
  23. ijin sedot gan :D

     
  24. gan maaf tolong di cek di http://mbahtrik.blogspot.com/ karena punya saya gak mulus padahal sudah ngikutin caranya seperti yg di atas

     
  25. Dodo M S Says:
  26. thx ya mas...ini sangat banyak membantu saya...tp yg saya copy sptnya ga ngefek ya...tdk ada perubahan untuk sharing is caringnya.
    http://decomile.blogspot.com/
    ini blog saya sdh saya ikuti semuanya dan hasilnya biasa aja...ga ada perubahan...mohon bantuannya ya...thx

     
  27. Dodi Harsono Says:
  28. Kunjungi blog ane yg newby ya gan...
    http://rodelaide.blogspot.com/

     
  29. andri Says:
  30. bagus infonya sob ,jangan lupa mampir yaaa...http://kink-exclusive.blogspot.com/

     
  31. MR AR Says:
  32. DOWNLOAD ASK MOM 3D SEX GAME FOR ADULTS 18+ CLICK HERE TO DOWNLOAD

    DOWNLOAD GTA 4 PC GAME INSTALLATION SETUP CLICK HERE TO DOWNLOAD

    DOWNLOAD TEKKEN 5 PC GAME HIGHLY COMPRESSED INSTALLATION SETUP CLICK HERE TO DOWNLOAD

    DOWNLOAD SEDUCE ME SEX ADULT PC GAME 18+ CLICK HERE TO DOWNLOAD

     
  33. iohdy asfgdu Says:
  34. oke, mas mksih tutorialnya
    templatenya keren :D
    http://dunia-android21.blogspot.com

     
  35. dede suryadi Says:
  36. makasih kang infonya

    http://adutburza.blogspot.com/
    ww.giribig.com
    duniagame.info
    idcheat.com

     

Posting Komentar


close