How to make a guest book / mailbox / shoutbox open the lid on the right







In previous articles we have discussed how to make a guest book, mailbox or shoutbox. Please find listed the contents of this blog. if you do not have a shoutbox, please register here. And if you own, follow the steps below to design it to the right page 
with the lid open button. 


There are also advantages, namely to make space on your pages smaller. Either immediately wrote, as I said above, you should have a shoutbox first. If you are sure immediately follow the steps below ..

1. You need to login your blog
2. Select the Edit menu design layout = >>
3. go to "add widget"
4. The script then copy and paste the code below into it,



<Style type = "text / css">
#gb {
position: fixed;
top: 50px;
z-index: +1000;
}
* Html #gb {position: relative;}
.gbtab {
height: 120px;
width: 40px;
float: left;
cursor: pointer;
background: url ( 'http://i299.photobucket.com/albums/mm308/willydachi/chat-box_zps6f9fdb1d.png')
no-repeat; }
.gbcontent {
float: left;
border: 2px solid # 444444;
background: # F5F5F5;
padding: 10px;
}
</ Style>
<Script type = "text / javascript">
showHideGB function () {
var gb = document.getElementById ( "GB");
var w = gb.offsetWidth;
gb.opened? moveGB (0, 30-w): moveGB (20-w, 0);
gb.opened =! gb.opened;
}
moveGB function (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> Put here script code of your shoutblox !! </ center>
<Div style = "text-align: right">
<a> <font size = "1" "> No SPAM .. !!! </ font> <a </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>

5. For a code blue simply replaced with script code of your previous shoutbox
6. After that click ok, lau save.

How, is not it ?? Good luck..


Previous
Next Post »