memasang shout box tersembunyi 20

malam semua ..... hadu... padahal mata udah cpe' nie .. tapi harus nungguin ade yang belum pulang les .... dari pada bengong nungguin mending posting aja .... kali ini saya ingin coba berbagi bagaimana cara memasang shout box yang bisa di sembunyikan/hiden di samping layar. ini sangat berguna untuk menghemat space di blog kita contohnya ... sbb :



kalau tertarik untuk memasang trik yang ini langsung saja ikuti langkah berikut ini :

• masuk ke account blogger

• langsung ke tata letak - elemen halaman ( buat sebuah gadget HTML/java script )

• masukan cod dibawah ini :

<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/AVvXsEgpS-24ztR1qctvquNx7H13Yhyphenhyphenok4KCYMyGqwoc1FsbZvAD7Rpfn1zViguJdWu3P0P3XpRIkRGTOnWrW65fkEAs5Sc9pYLV1_xkM3jBdLBj5I-3gIFSJXrUTGqkPnvBMm51fGmeHA7LbQfR/s128/tabs.png') 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">

< Letakkan kode Shoutbox Anda disini >


<div style="text-align:right">
<a href="http://muhamadhaidirali.blogspot.com">
[ Toturial blog ]
</a>|<a href="javascript:showHideGB()">
[ x close ]
</a>
</div>


</div>

( ubah code yang berwarna merah dengan code shout box anda )

• simpan

Baca Juga Artikel Terkait