Cara Membuat Widget Melayang Di Blog

Lihat yang melayang-layang dipostingan ini.. hee
Loh kok yang melayang Google Friend Connect??? ...xixixi
Kalau blog yang biasanya memakai script ini untuk memasang tombol share atau like facebook, twitter melayang-layang kalau saya pengennya sensasi yang berbeda dong ... hee

Yuk lah capcussssss saja lah langsung ke praktek cara membuat widget follow melayang di blog
Copy kode dibawah ini:

<style type="text/css">

#topbar{

position:absolute;

padding-left:260px;

background-color: transparancy;

width: 300px;

visibility: hidden;

z-index: 100;

}

</style>

<script type="text/javascript">

var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session

var startX = 30 //set x offset of bar in pixels

var startY = 5 //set y offset of bar in pixels

var verticalpos="fromtop" //enter "fromtop" or "frombottom"

function iecompattest(){

return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body

}

function get_cookie(Name) {

var search = Name + "="

var returnvalue = "";

if (document.cookie.length > 0) {

offset = document.cookie.indexOf(search)

if (offset != -1) {

offset += search.length

end = document.cookie.indexOf(";", offset);

if (end == -1) end = document.cookie.length;

returnvalue=unescape(document.cookie.substring(offset, end))

}

}

return returnvalue;

}

function closebar(){

if (persistclose)

document.cookie="remainclosed=1"

document.getElementById("topbar").style.visibility="hidden"

}

function staticbar(){

barheight=document.getElementById("topbar").offsetHeight

var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;

var d = document;

function ml(id){

var el=d.getElementById(id);

if (!persistclose || persistclose && get_cookie("remainclosed")=="")

el.style.visibility="visible"

if(d.layers)el.style=el;

el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};

el.x = startX;

if (verticalpos=="fromtop")

el.y = startY;

else{

el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;

el.y -= startY;

}

return el;

}

window.stayTopLeft=function(){

if (verticalpos=="fromtop"){

var pY = ns ? pageYOffset : iecompattest().scrollTop;

ftlObj.y += (pY + startY - ftlObj.y)/8;

}

else{

var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;

ftlObj.y += (pY - startY - ftlObj.y)/8;

}

ftlObj.sP(ftlObj.x, ftlObj.y);

setTimeout("stayTopLeft()", 10);

}

ftlObj = ml("topbar");

stayTopLeft();

}

if (window.addEventListener)

window.addEventListener("load", staticbar, false)

else if (window.attachEvent)

window.attachEvent("onload", staticbar)

else if (document.getElementById)

window.onload=staticbar

</script>

<br />

<div class="clear">

</div>

<div id="topbar">

<div style="text-align: right;">

<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrV3qECaAbViSHuilNwytLVMhBVtva1mQ1_mKdLa340mM9ZKfaKtLSSfcE47fv-TjFKTbiJRFXfB217vsLWizgUqcaLNP2Ypv4-2tYcDSBRC8qJp9bs1aWyMrFCAOtETtRAhgDUso2O4aj/s1600/close3.png" /></a></div>

<center>

<div style="background: #fff;">

GANTI TULISAN INI DENGAN KODE SCRIPT HTML LIKE - SHARE FACEBOOK - TWITTER - GOOGLE FRIEND CONNECT - DLL SILAHKAN UJI COBA SENDIRI

</div>

</center>

</div>

Cara memasang ke blog
1. Login ke blogger
2. Ke menu Design
3. Add a Gadget
4. Pilih add HTML
5. Masukkan kode ke kotak HTML
6. Save & Lihat hasilnya

Kalau kamu ingin widget melayang hanya ada di satu halaman (seperti ini), kamu cukup menyisipkan kodenya kedalam postingan saja, sisipkan kode diposisi paling bawah posting blog untuk memudahkan ketika mengetik artikel posting blog