begginning javascript, please help - simple script won't work... can't figure out why...
well, this is a script where you are promted for two pairs of X and Y coordinates, and 'moves'. then a little red box starts at the first (x,y) and over whatever amount of moves you choose, will move to the second (x,y) and stay there. However, when i give it fairly small numbers to work will, it will have an error and somehow the (x,y) has gotten to be like a string of a few hundred numbers (untra-tril-ga-billion?) and thus the square is far far away, requiring lots of scrolling... i can't figure out where in the script i'm adding or multiplying too much??? here's a link to the html document with the script, and following it the source code itself.
http://ctpball.paintballresource.com/stuff/animated_move.html
<html>
<head>
<title>Moving block, by Dan Tucker</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var x1, y1, x2, y2, move, xdistance, ydistance, xstep, ystep
//here it will test for netscape4 or IE4
ns4 = (document.layers)? true:false
ie4 = (document.all)? true:false
//here it will make 'block' usable for either IE4 or netscape4
//also makes .xpos and .ypos so that it can deal with non-integer variables
//this function will be loaded in the body tag
function init() {
if (ns4) block = document.blockDiv
if (ie4) block = blockDiv.style
block.xpos = parseInt(block.left)
block.ypos = parseInt(block.top)
}
//asks for begginning (x,y), ending (x,y) and how many moves to get there
function travel1() {
x1 = prompt("starting X coordinate?", "")
y1 = prompt("starting Y coordinate?", "")
x2 = prompt("end X coordinate?", "")
y2 = prompt("end Y coordinate?", "")
moves = prompt("moves between two points?", "")
//block is set to starting coordinates, and the distance for each move is calculated
block.xpos = x1
block.ypos = y1
block.left = block.xpos
block.top = block.ypos
xdistance = x2-x1
ydistance = y2-y1
xstep = xdistance/moves
ystep = ydistance/moves
//the block is moved in 'moves' amound of steps, to the end coordinates
while (moves>0) {
block.xpos = block.xpos + xstep
block.ypos = block.ypos + ystep
block.left = block.xpos
block.top = block.ypos
setTimeout("moves--", 500);
}
}
//-->
</SCRIPT>
</HEAD>
<BODY BGCOLOR="#FFFFFF" onLoad="init()">
<A HREF="javascript:travel1()">animated move click here to begin</A>
<BR><A HREF="javascript:alert(block.xpos + ', ' + block.ypos + ', xstep:' + xstep + ', ystep:' + ystep + ', xdistance:' + xdistance + ', ydistance:' + ydistance)">check location</A>
<DIV ID="blockDiv" STYLE="background:red; position:absolute; left:100; top:80; height:30; width:30; visibility:visible;">
</DIV>
</BODY>
</HTML>
----------
Dan Tucker
http://ctpball.paintballresource.com
John Pollock posted this at 21:21 — 31st August 1999.
He has: 628 posts
Joined: Mar 1999
It gave me an invalid argument error at line 44, which is:
block.left = block.xpos
It may be you need to use the parseInt() function right after you prompt for the coordinates and the number of moves to be sure they are integers. I'm not sure thatis it, but it may be worth a try.
----------
Page Resource: http://www.pageresource.com
JavaScript City: http://www.javascriptcity.com
Java Script: A Beginner's Guide
Page Resource
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.