触摸艺术和时尚的音弦
---- happydog's art secret garden ~~~
Javascript&Ajax笔记四
TAG:
-
引用
刪除
wel3kxial / 2008-04-21 20:57:23
-
Wandering Div
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
var the_timeout;
function move()
{
var the_div, move_amount;
the_div = document.getElementById('numberOne').style;
move_amount = parseInt(Math.random() *10);
// alert(move_amount);
//这个随机数是在0-0.999999...之间
random_number1 = parseInt(Math.random() *10);
if (random_number1 <5) { alert(the_div.left);
the_div.left = parseInt(the_div.left) +move_amount;
} else {
the_div.left = parseInt(the_div.left) -move_amount;
}
random_number2 = parseInt(Math.random() *10);
if (random_number2 <5) {
the_div.top = parseInt(the_div.top) +move_amount;
} else {
the_div.top = parseInt(the_div.top) -move_amount;
}
the_timeout = setTimeout("move()",100);
}
</script>
</head>
<body>
<h1> The Wandering One </h1>
<div id = "numberOne" style="position:absolute; top:150;left:100; z-index:-1;" >
<p> This is a moving DIV </p> </div> <br />
<a href="#" onclick="the_timeout=setTimeout('move();',100); return;"> Start wandering. </a>
<a href="#" onclick="clearTimeout(the_timeout); return;"> Stop wandering. </a>
</body>
</html>