Guest Book Show / Hide from Above

Some time ago someone asked how do I make guets book like the one on my blog, well on this occasion I will give his review, direct yes yes ...

      How to make:
1. Login bloggers
2. The design, Add Gadget, HTML / Java Script
3. And Save the following code:

<style type="text/css">
#gb{
position:fixed;
right:450px;
z-index:+1000;
}
#tabGb {
position:fixed;_position:relative;top:50px; right:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollright+ document.documentElement.clientWidth - offsetWidth); }
* html #gb{position:relative;}

.gbcontent{
float:left;
border:2px solid #4173af;
background:#ffffff;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 1500-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">


<div class="gbcontent">

<!--  Script Chatbox nya disini -->


<center><a href="javascript:void(0);" onclick="showHideGB()"><input type="button" value="Close" class="close" /></a>

</center></div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.top = (-400-gb.offsetWidth).toString() + "px";
</script>

<div id="tabGb"><a href="javascript:void(0);" onclick="showHideGB()" title="Buku Tamu"><img alt="Buku Tamu" heigth="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2gkKpD6Q5QeWhJ1EFAHFFp-JQyvImBljUTMj6h82t4sbUNiF0d1H2DUK2q2IglZWRem8Smtzx6YAC7jSwimELg-4aqU3xesjmg0JcwXkoheFerEq9MCgs8koI_Csn4QFsXjLfczu7XQY/s1600/Guestbook.png" border="0" /></a></div>
</div>

READ MORE - Guest Book Show / Hide from Above

Installing the Auto Scroll In Blog

Ok immediately wrote We Practice

Ok immediately wrote We Practice 
How to install the show / hide auto scroll:
Go to the dashboard ► LAYOUT ► EDIT HTML ► check the Expand Widget Templates and find the following code. to this code (press ctrl + F): </head> Then copy the following code right above the code </head>
Quote unmarked "

"<script src='http://yourjavascript.com/09154511902/autoscror.js' type='text/javascript'/>  "

Then reinsert the following script code under the code </head>

<style>  .speedbar {list-style-type:none;border:1px solid #424242;height:10px;margin-left:-40px;}  .capt {font-family:arial;font-size:8pt;color:#000000;margin-left:-5px;} </style>
<div style='position:fixed;right:0px;top:250px;'> <div id='speednav' style='background:#424242;padding:10px;float:right;width:24px;height:122px;display:none;'> <div class='capt'>SPEED</div> <ul> <li style='list-style-type:none;border:0px;width:20px;margin-left:-40px;font-family:arial;font-size:7pt;color:#CCC;text-align:center;'>high</li> <li class='speedbar' id='speed5' onclick='startit(5);' onmouseout='resetBg();' onmouseover='this.style.cursor=&apos;pointer&apos;;changeBg(5);' style='background:#999;width:20px;'/> <li class='speedbar' id='speed4' onclick='startit(4);' onmouseout='resetBg();' onmouseover='this.style.cursor=&apos;pointer&apos;;changeBg(4);' style='background:#aaa;width:20px;'/> <li class='speedbar' id='speed3' onclick='startit(3);' onmouseout='resetBg();' onmouseover='this.style.cursor=&apos;pointer&apos;;changeBg(3);' style='background:#bbb;width:20px;'/> <li class='speedbar' id='speed2' onclick='startit(2);' onmouseout='resetBg();' onmouseover='this.style.cursor=&apos;pointer&apos;;changeBg(2);' style='background:#ccc;width:20px;'/> <li class='speedbar' id='speed1' onclick='startit(1);' onmouseout='resetBg();' onmouseover='this.style.cursor=&apos;pointer&apos;;changeBg(1);' style='background:#ddd;width:20px;'/> <li class='speedbar' onclick='stopit();' onmouseover='this.style.cursor=&apos;pointer&apos;;' style='font-family:arial;font-size:7pt;color:#CCC;text-align:center;width:20px;height:12px;'>stop</li> </ul> </div> <div id='speedtoogle' onclick='tooglespeed()' onmouseout='this.style.backgroundColor=&apos;#2E2E2E&apos;;' onmouseover='this.style.backgroundColor=&apos;#2E2E2E&apos;;this.style.cursor=&apos;pointer&apos;;' style='float:right;background:#2E2E2E'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO6s7WhyvLJygu1nfkyDjObS4-E47HYDCdE4-iQXiUD8lx5RAyq14YCJL1rquj2jezP3raW6g11JpYKbzyYdmB2hosbskcKJOEqxk-J5IC18wNqsCl412VJW0z-cuqF-2Tjd3awSE47_M/s1600/showautoscroll.png' style='border-right:1px solid #2E2E2E;'/></div> </div>

Lastly please press the save button template. so and hopefully show how to install auto scroll in blogger is helpful.
 
 

READ MORE - Installing the Auto Scroll In Blog