Terima kasih kerana sudi singgah lagi diblog ini kerana dahulunya ia telah ditutup atas sebab-sebab tertentu. Ia telah dibuka semula untuk berkongsi dengan anda tips dan trick blogger yang baru untuk anda. Post kali ini akan mengajar anda untuk menjadikan shoutmix anda slide menu.
Langkah Pertama
log in ke blogger.com
Langkah Kedua
masuk ke elemen halaman
masuk ke elemen halaman
Langkah Ketiga
masukkan kode di bawah ini ke HTML/Java Script :
<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/AVvXsEhPkow2IefATgOdX4UrtltGMVYIOemjTY4-Dl1YtTFt001rsq5zhQ5p3AOGh7wTcilvsbuSQdsg61S1lK71yHaF7oYWEMF75RVYm0gmzkvGCzr2H_FyV1pgV5ppSTuCFcVIQM5AS2NXkcKo/') 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">
</a>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() "px";
</script>
Langkah keempat
Gantikan tulisan yang bold pada code javascript diatas denga code shoutmix anda sendiri. Mudah bukan. sekian terima kasih
masukkan kode di bawah ini ke HTML/Java Script :
<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/AVvXsEhPkow2IefATgOdX4UrtltGMVYIOemjTY4-Dl1YtTFt001rsq5zhQ5p3AOGh7wTcilvsbuSQdsg61S1lK71yHaF7oYWEMF75RVYm0gmzkvGCzr2H_FyV1pgV5ppSTuCFcVIQM5AS2NXkcKo/') 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">
<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe title="crazyyas1" src="http://www5.shoutmix.com/?crazyyas1" width="160" height="350" frameborder="0" scrolling="auto">
<a href="http://www5.shoutmix.com/?crazyyas1">View shoutbox</a>
</iframe>
<br /><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br />
<!-- End ShoutMix --></center>
<a href="javascript:showHideGB()"></a>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() "px";
</script>
Langkah keempat
Gantikan tulisan yang bold pada code javascript diatas denga code shoutmix anda sendiri. Mudah bukan. sekian terima kasih
