Rabu, 11 Maret 2015

Cara Membuat Buku Tamu Melayang

Cara Membuat Buku Tamu Melayang Diblog -silahkan sahabat lakukan langkah langkah dibawah ini :
1. Login ke Blogger
2. Pilih Tata Letak
3. Lalu tambahkan Gadget baru atau Widget Baru "Add Gadget"
4. Setelah itu pilih HTML/Javascript
5. Copy kode dibawah ini dan letakan kedalam Widget yang telah sahabat buat.

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:142px;
width:60px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqhdPrSF7-XjlFB3WH0XmiRnJEx39MXiqjc9NUZoRVklyMm5SpZGZD9t78Mx22oT9IDYIJWrnK-GSb4bFr7nJfsKJQ6ETedJAoWV7vgJ4zhLsIHAtzlAZYuVq-dbYCdSrI_Ehf2T3tXT4_/s1600/Nomor-Cantik.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #ff8000;
background:#F5F5F5;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 60-w) : moveGB(50-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 SAHABAT DISINI
<div style="text-align:right">
<a href="http://www.sundaboy.com/">Media Sharing</a>><a href="javascript:showHideGB()">(BUKA)</a>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

Keterangan :
Silahkan sahabat ganti MASUKAN KODE BUKU TAMU SAHABAT DISINI dengan kode Buku Tamu milik sahabat.
Apabila sahabat mengerti kode java script silahkan untuk merubah atau memberi sentuhan lain didalam kode script diatas, tapi dimohon untuk tidak menghapus link yang ada didalamnya.
6. Simpan Template dan lihatlah hasilnya.

0 komentar:

Posting Komentar

luvne.com resepkuekeringku.com desainrumahnya.com yayasanbabysitterku.com