Whilst waiting for the tutor to arrive in a web design class last night I wrote this JavaScript routine to make a box bounce around the screen. It didn't work, so I rewrote it when I got back home. But it
still didn't work, so I spent an hour puzzling over it to no avail.
By my reckoning there's nothing wrong with it, but evidently DW thinks otherwise. Fame and fortune to whoever spots my mistake:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>My Webpage</title>
<script type = "text/javascript">
<!--
var horzWall = 800;
var vertWall = 800;
function Entity () {
this.x = 50;
this.y = 50;
this.horzDirection$ = "Right";
this.vertDirection$ = "Down";
this.apDiv$ = "apDiv2";
this.Move = Move;
}
function Move () {
if (this.horzDirection$ == "Left") {this.x = this.x - 3;}
if (this.horzDirection$ == "Right") {this.x = this.x + 3;}
if (this.vertDirection$ == "Up") {this.y = this.y - 2;}
if (this.vertDirection$ == "Down") {this.y = this.y - 2;}
if (this.x < 0) {this.horzDirection$ = "Right";}
if (this.x > horzWall) {this.horzDirection$ = "Left";}
if (this.y < 0) {this.vertDirection$ = "Up";}
if (this.y > vertWall) {this.vertDirection$ = "Down";}
element = document.getElementById (this.apDiv$);
element.style.left = this.x;
element.style.top = this.y;
}
function TimedCount () {
pic.Move ();
timer = setTimeout ("TimedCount ()", 100);
}
-->
</script>
</head>
<body>
<div id="apDiv2" style="width:100px; height:100px; background-color:#FFCC00; text-align:center"><p><br /><br /><i>Text</i></p></div>
<script type = "text/javascript">
<!--
pic = new Entity ();
TimedCount ();
-->
</script>
</body>
</html>
