Pages

Tutorial, Tips n Trick

Sabtu, 30 Oktober 2010

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
Share this post
  • Share to Facebook
  • Share to Twitter
  • Share to Google+
  • Share to Stumble Upon
  • Share to Evernote
  • Share to Blogger
  • Share to Email
  • Share to Yahoo Messenger
  • More...

1 komentar

  1. Bang pas ane coba kok shout boxnya ada 2? trs yg satunya kgk bisa di tutup.. kunjungi sejenak blog saya http://aldobloggercom.blogspot.com

    BalasHapus

:) :-) :)) =)) :( :-( :(( :d :-d @-) :p :o :>) (o) [-( :-? (p) :-s (m) 8-) :-t :-b b-( :-# =p~ :-$ (b) (f) x-) (k) (h) (c) cheer

 
Posts RSSComments RSSBack to top
© 2011 BLOGGER TUTORIALS ∙ Designed by BlogThietKe
Released under Creative Commons 3.0 CC BY-NC 3.0