Hallo sahabat Dhastone Blog's, sudah lama ya kang tidak bahas hacking blogger lagi. Nah pada kesempatan kali ini kang salman akan mengulas sedikit tips bagaimana membuat iklan melayang di samping kiri dan kanan fixed seperti yang ada di kapanlagi.com atau vivanews, tapi ini kang salman beri nama versi 1, kok ada versi-versinya? ya kedepannya kang salman akan ulas versi 2 nya kode-kode masih dalam penggarapan dan belum kang salman tuntaskan. Namun saya yakin tutorial ini pun sudah sedikit mengobati rasa penasaran Anda.
LIHAT DEMO
Silakan copy kode di bawah ini dan simpan di bawah kode <body>:
LIHAT DEMO
Silakan copy kode di bawah ini dan simpan di bawah kode <body>:
<style type="text/css">Source code by: kalteng-blog.blogspot.com
.float {
width: 150px;
height: 800px;
border: solid 1px white;
}
</style>
<!--code of scrolling banner -->
<div id="rightbanner" class="float"><a href="http://www.kalteng-blog.blogspot.com"><img src="link to your banner" border="0"></a></div>
<div id="leftbanner" class="float"><a href=" http://www.kalteng-blog.blogspot.com" target="_blank">
<img src="link to your banner" border="0"></a></div>
<script type="text/javascript">
function setPosition(id, position) {
var store = {
ram : {
top : 0,
left : 0,
right : 0,
bottom : 0
},
rom : {
top : null,
left : null,
right : null,
bottom : null
}
};
for (var i in position) {store.rom[i] = position[i];}
var element = document.getElementById(id);
for (i in store) {element[i] = store[i];}
element.rom.move = function() {
if (window.innerHeight) {
var topPage = window.pageYOffset;
var leftPage = window.pageXOffset;
var rightPage = leftPage + window.innerWidth - element.offsetWidth;
var bottomPage = topPage + window.innerHeight - element.offsetHeight;
}
else {
var topPage = document.body.scrollTop;
var leftPage = document.body.scrollLeft;
var rightPage = leftPage + document.body.clientWidth - element.offsetWidth;
var bottomPage = topPage + document.body.clientHeight - element.offsetHeight;
}
element.style.position = "absolute";
if (element.rom.top != null) {
element.ram.top += Math.round((topPage + element.rom.top - element.ram.top)/20);
element.style.top = element.ram.top;
}
if (element.rom.left != null) {
element.ram.left += Math.round((leftPage + element.rom.left - element.ram.left)/20);
element.style.left = element.ram.left;
}
if (element.rom.right != null) {
element.ram.right += Math.round((rightPage - element.rom.right - element.ram.right)/20);
element.style.left = element.ram.right;
}
if (element.rom.bottom != null) {
element.ram.bottom += Math.round((bottomPage - element.rom.bottom - element.ram.bottom)/20);
element.style.top = element.ram.bottom;
}
setTimeout("document.getElementById('"+element.id+"').rom.move()",10);
};
element.rom.move();
}
setPosition("a", {top: 0, left: 880});
setPosition("c", {top: 0, left: 20});
</script>
<!--end code -->
