/    Sign up×
Community /Pin to ProfileBookmark

uneven random bounce of object

[CODE]<html>
<head>
<title>
</title>
<style>
#fone{
position:absolute;
left:150px;
top:500px;
}
#line{
position:absolute;
left:80;
top:20;
background-color:gray;
border-left: 2px solid black;
border-right:2px solid black;
width:250;
height:700;
z-index:1;
}

#hyp{
position:absolute;
left:100px;
top:100px;
}</style>
<script>
var xpos2 = 200;
var ypos2 = 100;
var x=30;
var y =30;
var rx =100;
var ry=100;
var i=40;
var timer;
function stoptimer()
{
clearTimeout(timer);

}
function en()
{
obj=document.getElementById(“hyp”);
obj.style.display=”none”;
}

function ens()
{
xpos2=100;
ypos2 =100;
obj=document.getElementById(“hyp”);
obj.style.left=xpos2 +”px”;
obj.style.top=ypos2 +”px”;
}
function goleft()
{
obj=document.getElementById(“hyp”);
obj.style.left=rx;
obj.style.top=ry +”px”;
var pp = parseInt(obj.style.top);
if(pp > 500)
{
en();
}
else
{

obj=document.getElementById(“hyp”);
var pl = parseInt(obj.style.top);

obj.style.left = rx + “px”;

;
randnum= Math.floor(Math.random()*6)+1;
ry=ry+randnum;
obj=document.getElementById(“hyp”);
i++;
obj.style.left=(rx-1)-i;
obj.style.top = ry + “px”;

timer=setTimeout(“goleft()”,10);

}
}

function raset()
{
obj=document.getElementById(“hyp”);
obj.style.left=rx;
obj.style.top=ry +”px”;
var pp = parseInt(obj.style.top);
if(pp > 600)
{
en();
}
else
{
randnum= Math.floor(Math.random()*6)+15;
ry=ry+randnum;
obj=document.getElementById(“hyp”);
i++;
obj.style.left=(rx+i)+i;
obj.style.top=ry +”px”;

timer=setTimeout(“raset()”,10);
var pp = parseInt(obj.style.top);
var bb = parseInt(obj.style.left);
if (bb > 200)
{
goleft();
}
}
}

function move(x,y){
xpos2=x;
ypos2 =y;
obj=document.getElementById(“hyp”);
obj.style.left=xpos2 +”px”;
obj.style.top=ypos2 +”px”;

}
function stoptimer()
{
clearTimeout(timer);
}

</script></head><body onload=”raset();”
onunload=”stoptimer();” ><div id=’line’><div><img id=”fone” src=’2c.gif’
onclick=”move(9, 7)” />
<img id=”hyp” src=’3c.gif’ />

[/CODE]

I am new to Javascript, although I know several other languages, and no matter how hard I try I just can’t seem to get the hang of it.
here I have an image object that I need to bounce off the side of the window border in a random arc that still has a chance of hitting the img object at the bottom of the page, however the object shoots-out when it hits the border what am I doing wrong

to post a comment
JavaScript

1 Comments(s)

Copy linkTweet thisAlerts:
@FangSep 15.2008 — Added DTD

JavaScript properties left and top require units (px)

CSS dimension properties also require units, (width:250[COLOR="Blue"]px[/COLOR]; etc).

Invalid nesting of html elements.
&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;
&lt;html&gt;
&lt;head&gt;
&lt;title&gt;&lt;/title&gt;
&lt;style type="text/css"&gt;
#fone{
position:absolute;
left:150px;
top:500px;
}
#line{
position:absolute;
left:80px;
top:20px;
background-color:gray;
border-left: 2px solid black;
border-right:2px solid black;
width:250px;
height:700px;
z-index:1;
}

#hyp{
position:absolute;
left:100px;
top:100px;
}
&lt;/style&gt;
&lt;script type="text/javascript"&gt;
var xpos2 = 200;
var ypos2 = 100;
var x=30;
var y =30;
var rx =100;
var ry=100;
var i=40;
var timer;
function stoptimer()
{
clearTimeout(timer);

}
function en()
{
obj=document.getElementById("hyp");
obj.style.display="none";
}

function ens()
{
xpos2=100;
ypos2 =100;
obj=document.getElementById("hyp");
obj.style.left=xpos2 +"px";
obj.style.top=ypos2 +"px";
}
function goleft()
{
obj=document.getElementById("hyp");
obj.style.left=rx + "px"; <br/>
obj.style.top=ry +"px";
var pp = parseInt(obj.style.top);
if(pp &gt; 500)
{
en();
}
else
{

obj=document.getElementById("hyp");
var pl = parseInt(obj.style.top);

obj.style.left = rx + "px";

;
randnum= Math.floor(Math.random()*6)+1;
ry=ry+randnum;
obj=document.getElementById("hyp");
i++;
obj.style.left=(rx-1)-i + "px";
obj.style.top = ry + "px";

timer=setTimeout("goleft()",10);



}
}


function raset()
{
obj=document.getElementById("hyp");
obj.style.left=rx +"px"; <br/>
obj.style.top=ry +"px";
var pp = parseInt(obj.style.top);
if(pp &gt; 600)
{
en();
}
else
{
randnum= Math.floor(Math.random()*6)+15;
ry=ry+randnum;
obj=document.getElementById("hyp");
i++;
obj.style.left=(rx+i)+i + "px"; <br/>
obj.style.top=ry +"px";

timer=setTimeout("raset()",10);
var pp = parseInt(obj.style.top);
var bb = parseInt(obj.style.left);
if (bb &gt; 200)
{
goleft();
} <br/>
}
}




function move(x,y){
xpos2=x;
ypos2 =y;
obj=document.getElementById("hyp");
obj.style.left=xpos2 +"px";
obj.style.top=ypos2 +"px";




}
function stoptimer()
{
clearTimeout(timer);
}

&lt;/script&gt;
&lt;/head&gt;
&lt;body onload="raset();" onunload="stoptimer();"&gt;
&lt;div id="line"&gt;
&lt;img id="fone" src="2c.gif" onclick="move(9, 7)"&gt;
&lt;img id="hyp" src="3c.gif"&gt;
&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
×

Success!

Help @kiwi2 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.28,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...