Cara Membuat Buku Tamu Tersembunyi di Blog

Buku tamu merupakan hal yang penting dalam blog, dikarenakan disinilah para blogger saling menyapa dan memberikan pendapatnya mengenai blog kita. Namun salah satu yang bikin masalah yaitu mencari peletakanya. Kadang - kadang para blogger binggung memasangnya dimana. Nah kalo masalah itu ada solusinya yaitu memasang Buku tamu yang melayang.

Salah satu keuntungnya yaitu ini akan mengikuti letak kusor, naik maupun turun. Tapi di setiap keuntungan ada kerugian, kerugianya adalah aga lambat dalam meload. Maka dari itu sebelum memasang ini harus diperhitungkan juga masalah kecepatanya.

Nah saya tak akan memperpanjang lagi pembahasan, saya langsung saja memberikanscript tersebut yaitu :

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">

<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe title="m4n0" src="http://www6.shoutmix.com/?m4n0" width="160" height="400" frameborder="0" scrolling="auto">
<a href="http://www6.shoutmix.com/?m4n0">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 -->
<br/>
Anda berminat buat Buku Tamu seperti ini?<br/>
Klik di
<a href="http://purnomozone.blogspot.com/2013/12/cara-membuat-buku-tamu-tersembunyi-di.html&quot;>
sini </a>

<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>

</div>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

Catatan:

• Jangan satukan dengan iklan yang melayang karena akan menjadi kacau.
• Yang diberi tanda berupa huruf yang merah dapat diganti, contohnya buku tamu anda yang shoutbox atau cbox. 

Selamat mencoba........

Read More

Cara Membuat Efek Nudging Pada Label

Cara Membuat Efek Nudging Pada Label - Pembuatan efek label bergoyang difungsikan untuk menambah keindahan dalam blog, cara kerjanya yang halus mengoyang-goyangkan label jika mouse diarahkan, untuk membuatnya masuk pada Design - Edit HTML dan cari kode </head> dan letakan kode jquery dibawah ini diatasnya :

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script>

Note : Kode jquery tersebut diatas sangat umum dipakai, jika didalam template kalian sudah ada kode 
jquery tersebut, kalian tidak perlu menambahkan (cukup 1 saja), kemudian tambahkan kode dibawah ini dan letakan dibawah kode jquery tersebut.

<script type='text/javascript'>$(document).ready(function() {$(&#39;#Label1 li&#39;).hover(function() { //mouse in$(this).animate({ marginLeft: &#39;12px&#39; }, 400);}, function() { //mouse out$(this).animate({ marginLeft: 0 }, 400);});});</script>

Save template kalian dan lihat hasilnya.

Read More