OK BROTHER. Powered by Blogger.

C. MEMBUAT BUKU TAMU (AUTO HIDE)

C. MEMBUAT BUKU TAMU (AUTO HIDE)

Kami meletakkan widget shoutMix atau sejenisnya pada buku tamu dengan menggunakan tambahan kode dibawah ini, caranya : tambah widget pilih add kode html kemudian masukan kode dibawah ini berikut dengan widget shoutmixnya. Perhatikan kode dibawah ini:


<style type="text/css">
#gb{
position:fixed;
top:25px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;

float:left;
cursor:pointer;
background:url('http://i37.tinypic.com/345o85i.gif') no-repeat;
}
.gbcontent{
float:left;
border:1px 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">

<center>
SILAHKAN PASTE WIDGET UNTUK BUKU TAMU DI SINI seperti Shoutmix atau cBOX atau ShoutBox dll sesuai keinginan anda</center>

<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>

KETERANGAN:
  • Perhatikan width atau hight yang bercetal tebal sesuaikan dengan kebutuhan, silahkan kalau mau ganti ukurannya
  • Yang diblok warna kuning adalah alamat dari url gambar "BUKU TAMU" silahkan ganti sesuai selera yang brother suka
  • Teks yang diblok warna merah adalah tempat untuk meletakkan kode dari ShoutMix atau CBox atau Shout Box atau sejenisnya apa yang brother sudah punya, kalau belum daftar dulu untuk mendapatkan kode shout....
  • Yang diblok warna hijau ada teks "close" silahkan ganti sesuai selera brother
 Silahkan brother coba..karena ok brother sudah terapkan, semoga berhasil....

ARTIKEL DALAM SATU LABEL



0 komentar:

widgeo.net

ARTIKEL SECARA ACAK

ARSIP BLOG