Home »»Cara pasang widget Tools di samping Blog

Cara pasang widget Tools di samping Blog

Posted on 2:52 PM by Damar Yosa Aji

http://a.imageshack.us/img340/2817/tabscopy.png
 Cara membuat widget Tools mungkin bisa membuat blog kita lebih ramping dan tidak memakan tempat karena widget Tools ini bisa melayang mengikuti page yang berada di layar monitor... Kalau kamu mautahu caranya ikuti tutorial berikut ini :



1) log in ke account blogger anda
2) masuk ke tata letek > elemen halaman > tambah gadget > pilih hhtml/java script
3) masukan kode berikut ini ke dalam hml/java script anda

<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('http://a.imageshack.us/img340/2817/tabscopy.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #c0c0c0;
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">

<div style="overflow:auto;width:autopx;height:200px;padding:10px;border:1px solid #eee">



Pasang Scrip anda disini : bisa scrip tolls apa saja masukan di sini


</script></div></div>

NB:GANTI KODE YANG BERWARNA Orange DENGAN KODE Tools ANDA

4) Simpan dan lihat hasilnya

Kritik komentar dan saran kalian sangat ditunggu bro, Maklum masih Newbie............

page Number