html 飞动广告,Javascript实现飞动广告效果的方法

/p>

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

飞动的广告

body,div,p

{

margin:0;

padding:0;

font-size:14px;

}

#divMain

{

width:200px;

height:800px;

}

var tmrID;

var x = 1;

var y = 1;

function moveAD() {

var divFly = document.getElementById("divFly");

var moveX = parseInt(divFly.style.left) + x * 5;

var moveY = parseInt(divFly.style.top) + y * 5;

//divFly.offsetWidth

if ((moveX + divFly.offsetWidth) >= document.body.clientWidth) {

x = -1;

}

if ((moveY + divFly.offsetHeight) >= document.body.clientHeight) {

y = -1;

}

if (moveX <= 0) {

x = 1;

}

if (moveY <= 0) {

y = 1;

}

divFly.style.left = moveX;

divFly.style.top = moveY;

}

function ClearTimer() {

clearInterval(tmrID);

}

function fly() {

tmrID = setInterval(moveAD, 20);

}

window.onload = function () {

var divFly = document.getElementById("divFly");

divFly.onmouseover = function () {

ClearTimer();

}

divFly.onmouseout = function () {

fly();

}

fly();

}

function closeAD() {

ClearTimer();

var divFly = document.getElementById("divFly");

divFly.style.display = "none";

}

关闭