javascript 效果浮动 浮动层

javascript 浮动   javascript浮动广告   javascript 浮动层   javascript效果   javascript特殊效果 浮动效果   网页浮动图片效果   doctype 浮动效果   javascript   javascript教程

  一个不停浮动的图片，遇到浏览器的任何一边，就会改变浮动的方向，如同一个弹球一样。这种效果主要用于网站广告，代码如下，将以下代码保存为htm文件就可以运行了。

<div id="img" style="position:absolute; left:35px; top:556px; width:120;
height:172">

<img src=\'#\'" /img>

</div>

<script language="javascript">

<!-- begin

var xpos = 20;

var ypos = document.body.clientheight;

var step = 1;

var delay = 30;

var height = 0;

var hoffset = 0;

var woffset = 0;

var yon = 0;

var xon = 0;

var pause = true;

var interval;

img.style.top = ypos;

function changepos() {

width = document.body.clientwidth;

height = document.body.clientheight;

hoffset = img.offsetheight;

woffset = img.offsetwidth;

img.style.left = xpos + document.body.scrollleft;

img.style.top = ypos + document.body.scrolltop;

if (yon) {

ypos = ypos + step;

}

else {

ypos = ypos - step;

}

if (ypos < 0) {

yon = 1;

ypos = 0;

}

if (ypos >= (height - hoffset)) {

yon = 0;

ypos = (height - hoffset);

}

if (xon) {

xpos = xpos + step;

}

else {

xpos = xpos - step;

}

if (xpos < 0) {

xon = 1;

xpos = 0;

}

if (xpos >= (width - woffset)) {

xon = 0;

xpos = (width - woffset);

}

}

function start() {

img.visibility = "visible";

interval = setinterval('changepos()', delay);

}

start();

// end -->

</script>
本文链接： javascript 效果浮动 浮动层