Home »
Tutorial blog
» Trik menyembunyikan buku tamu ( Chat Box )
Trik menyembunyikan buku tamu ( Chat Box )
pastinya teman2 pernah melihat di blog2 lain yang buku tamu nya ( Chat Box ) yang tersembunyi di sebelah sisi kiri Blog, nah bagi teman2 yang ingin mencoba nya teman2 bisa langsung mempraktekan nya di Blog teman2, teman2 tinggal ikuti aja langkah2 seperti bi bawah ini:
1. Masuk ke blogger teman2.
2. Pilih tata letak.
3. Pilih elemen halaman.
4. Klik Tambah Gadget.
5. Pilih tanda HTML/JavaScript.
6. Masukan code HTML/JavaScript di bawah ini di blog teman2
<style type="text/css">
#gb{
position:fixed;
top:25px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:150px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i629.photobucket.com/albums/uu13/akubsaputra/guestbook.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #1300F2;
background:#FFFFFF;
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">
MASUKAN KODE BUKU TAMU/WIDGET DISINI
<div style="text-align:right">
<a href="javascript:showHideGB()">
[close]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>
7. Klik tombol simpan
lalu lihat hasil nya di blog teman2.
Selamat mencoba nya, semoga artikel di atas bisa bermanfaat bagi teman2,!!!!
1. Masuk ke blogger teman2.
2. Pilih tata letak.
3. Pilih elemen halaman.
4. Klik Tambah Gadget.
5. Pilih tanda HTML/JavaScript.
6. Masukan code HTML/JavaScript di bawah ini di blog teman2
<style type="text/css">
#gb{
position:fixed;
top:25px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:150px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i629.photobucket.com/albums/uu13/akubsaputra/guestbook.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #1300F2;
background:#FFFFFF;
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">
MASUKAN KODE BUKU TAMU/WIDGET DISINI
<div style="text-align:right">
<a href="javascript:showHideGB()">
[close]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>
7. Klik tombol simpan
lalu lihat hasil nya di blog teman2.
Selamat mencoba nya, semoga artikel di atas bisa bermanfaat bagi teman2,!!!!


Post a Comment
Tidak Di Benarkan Melatakkan Link DI Dalam Kotak Komentar >> Maaf Akan Saya Hapus >> Terima Kasih..