Kayak'a Kali ini saya membuat artikel yang unik lah hehehe :D
yaitu Membuat Buku Tamu Yang Buka Tutup Nama'a aja udah jelas kayak'a nie buku bisa dibuka n ditutup... hehehe
Ok Fokus sob, buku tamu ini lebih populer dengan sebutan shoutbox, seperti yang banyak kita lihat..... cara menggunakn buku tamu ini yaitu kita tinggal mengklik tulisan Buku Tamu yang ada di pojok kanan atas laptop sobat, dan dapat di klik lagi untuk menutup kembali buku tamu tsb.... Untuk demo'a Sobat bisa lihat seperti pada blog Saya ini. Tertarik untuk mencoba'a sob...??? silahkan sobat buat widget shoutbox yang bisa sobat dapatkan di shoutmix atau cbox. Disana sobat registrasi dan buat widget'a, kemudian sobat ambil kode'a... lengkap dech...... hehehehe.....!!! :D
Ok ini dia cara Membuat Buku Tamu Yang Buka Tutup itu sob
1. Sobat Login ke Blogger, dengan akun sobat masing2
2. Pilih Rancangan kemudian tambah Gadget
3. Lalu Pilih HTML/JavaScript
4. Kemudian sobat masukkan kode script dibawah ini
<style type="text/css">
#gb{
position:fixed;
top:100px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQHA5SCOGvZikTSMjMwIoIuq82_mCPrLOO_uCFL7H8vDiqAub2icXNEk-y-syaGXeoTpW5bcRITfh6V-ZJA3t3b4Ha6_oZzAvY9QXCXo8LxyqqT-Gi8ijPBo_sR3CFfdnIBHk8CaK-OISP/') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:2px;
}
</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">
TARUH KODE WIDGET SHOUTMIX OR CBOX SOBAT DI SINI
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>
#gb{
position:fixed;
top:100px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQHA5SCOGvZikTSMjMwIoIuq82_mCPrLOO_uCFL7H8vDiqAub2icXNEk-y-syaGXeoTpW5bcRITfh6V-ZJA3t3b4Ha6_oZzAvY9QXCXo8LxyqqT-Gi8ijPBo_sR3CFfdnIBHk8CaK-OISP/') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:2px;
}
</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">
TARUH KODE WIDGET SHOUTMIX OR CBOX SOBAT DI SINI
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>
NB :
Taruh kode yang sudah sobat ambil dari shoutmix atau cbox ditempat yang sudah saya tentukan tadi, yaitu di tempat yang ada tulisan ( TARUH KODE WIDGET SHOUTMIX OR CBOX SOBAT DISINI). Kemudian simpan dan lihat hasil'a...
Semoga Bermanfaaat.......!!!!
Semoga Bermanfaaat.......!!!!
0 komentar:
Posting Komentar