Cara Membuat Widget 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/AVvXsEjpfMJU0rV1_plyYjOMbV_wUP-ox0x1AvpSz3M69vgnLiVySLsDCfFvjSqzxenDh9rNmJr_Z4hoNsv5U3ooynUUUj6Zbapp7WAKXGyewpUGn6nEqTxrTVeegtSCizwt_Y1umfd6WeMc9Dcx/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

By : Cutt Iswahyuni