Cara mudah membuat banner melayang

Para blogger yang menyertakan iklan di blognya dapat memilih penempatan maupun model pemasangan iklan yang di kehendeki, ada banyak sekali ragamnya, dalam kesempatan ini saya memposting tutorial membuat iklan (banner) melayang dengan cara yang sangat mudah. tutorial ini saya adopsi dari situs o-om.com.

klik disini untuk melihat DEMO nya

Berikut cara mudah membuat nya

silahkan login di blogger.com

pilih tata letak, lanjutkan dengan tambah elemen baru dan pilih Java/HTML, kemudian copy-paste kan kode di bawah ini.

Gantikan kode yang berwarna biru dengan kode iklan yang di kehendaki, lalu simpan.

<style type="text/css">
#gb{
position:fixed;
top:10px;
z-index:+1000;
}
* html #gb{position:relative;}


.gbcontent{
float:right;
border:2px solid #A5BD51;
background:#ffffff;
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.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">

<div style="text-align:right">
<a href="javascript:showHideGB()">
.:[Close][Klik 2x]:.
</a>
</div>
<center>

Masukan Kode iklan atau Gambar yang anda inginkan di sini

</center>

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

Selamat mencoba.