Membuat Buku Tamu Dari CBOX - Bagi sahabat IndPras yang berbahagia, satu lagi ilmu bagi kita semua yang akan coba saya bagikan kepada sahabat sekalian mengenai bagaimana membuat sebuah buku tamu dengan menggunakan bantuan CBOX. harusnya ini lebih etis kalau dibilang sebuah chat tapi kadang kala ini lebih dikenal sebagai buku tamu karena lebih mudah diakses oleh tamu blog kita. langsung saja
- buat akun dulu di cbox bagi yang belum punya disini
- saya anggap sahabat sekalian tidak ada kesulitan dalam membuat akun di cbox, jika sahabat sekalian ada yang merasa kesulitan silahkan sahabat sekalian komentar dibawah. jika ada waktu saya akan jawab semampu saya.
- agar lebih tertata rapi copy scrib berikut
<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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-EM9NZ7YbcD1xyx4nHqROcMgGOULPkwNQGcd6MEg60u0s4H8x5tEEg5I6gzpITMWR_819HlsxapsjijZ25GEyWHWjWFtZp-c38FhOInRUkD84JJ8I8QLQaG7Mt-70zKmQCV_-1jn6HsKy/') 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">
<!-- Ganti ini dengan kode buku tamu kamu -->
<br/>
Mau punya buku tamu seperti ini?<br/>
Klik di
<a href="http://karyaindpras.blogspot.com/2012/02/membuat-buku-tamu-dari-cbox.html">
sini (Info Blog)
</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>
#gb{
position:fixed;
top:50px;
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/AVvXsEh-EM9NZ7YbcD1xyx4nHqROcMgGOULPkwNQGcd6MEg60u0s4H8x5tEEg5I6gzpITMWR_819HlsxapsjijZ25GEyWHWjWFtZp-c38FhOInRUkD84JJ8I8QLQaG7Mt-70zKmQCV_-1jn6HsKy/') 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">
<!-- Ganti ini dengan kode buku tamu kamu -->
<br/>
Mau punya buku tamu seperti ini?<br/>
Klik di
<a href="http://karyaindpras.blogspot.com/2012/02/membuat-buku-tamu-dari-cbox.html">
sini (Info Blog)
</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>
- Pada kode di atas, cari kode
<!-- Ganti ini dengan kode buku tamu kamu -->
dan ganti kode tersebut dengan kode buku tamu yang kamu dapatkan dari situsnya, - Untuk tab kiri., Jadi caranya:
*) baris ke-14 dari atas, ganti jadi
background:url('http://lh6.ggpht.com/_jn57XA2jLxY/SmHeOh56MNI/AAAAAAAAAYY/PTGSodg9-w0/tableft.png');
*) baris ke-2 dari bawah, ganti "gb.style.right" jadi "gb.style.left" - Kamu juga bisa atur posisinya. Ubah aja nilai atribut top-nya ,,Kalau mau lebih ke atas dikit, ubah jadi 20px atau 30px terserah kamu.
Selamat Mencoba!!
Tidak ada komentar:
Posting Komentar
Berikan komentar anda, karena komentar anda sangat berarti bagi saya
terimaksih ^_^