collision detection

**merhaba** · Feb 3rd, 2005, 05:45 AM

Hi,
The problem with the following script is that the animation does not stop..I want the animation stop
if pic1 collides with pic2 but they do not stop..would you please fix it for me
***The other question is that I have only two pictures that animate..What if I have 10 objects on my page? writing the same codes for each object takes too much space..Is it possible to use arrays for this purpose
..."the zip file is attached"
thanks
.........................................
[ vbcode]
<HEAD>
<SCRIPT LANGUAGE="JavaScript">

var wwidth, wheight;
var ydir = '++';
var xdir = '++';
var ndir = '++';
var mdir = '++';

var id1, id2, id3;
var x = 100;
var y = 400;
var m=50
var n=100
var x1, y1;
var m1,n1;
function getwindowsize() {
clearTimeout(id1);
clearTimeout(id2);
clearTimeout(id3);

wwidth = document.body.clientWidth - 55;
wheight = document.body.clientHeight - 50;

id3 = setTimeout('randomdir()', 10000);
animate();
}
function randomdir() {
if (Math.floor(Math.random()*2)) {
(Math.floor(Math.random()*2)) ? xdir='--': xdir='++';
} else {
(Math.floor(Math.random()*2)) ? ydir='--': ydir='++';
}
id2 = setTimeout('randomdir()', 10000);
}
function animate() {
eval('x'+xdir);
eval('y'+ydir);
pic1.pixelLeft = x+document.body.scrollLeft+100;
pic1.pixelTop = y+document.body.scrollTop;
if (pic1.pixelTop <= 5+document.body.scrollTop) ydir = '++';
if (pic1.pixelTop >= wheight+document.body.scrollTop) ydir = '--';
if (pic1.pixelLeft >= wwidth+document.body.scrollLeft) xdir = '--';
if (pic1.pixelLeft <= 5+document.body.scrollLeft) xdir = '++';
//--------------------------------------------------------------------------------------------
eval('m'+mdir);
eval('n'+ndir);
pic2.pixelLeft = m+document.body.scrollLeft+100;
pic2.pixelTop = n+document.body.scrollTop;
if (pic2.pixelTop <= 5+document.body.scrollTop) ndir = '++';
if (pic2.pixelTop >= wheight+document.body.scrollTop) ndir = '--';
if (pic2.pixelLeft >= wwidth+document.body.scrollLeft) mdir = '--';
if (pic2.pixelLeft <= 5+document.body.scrollLeft) mdir = '++';
id1 = setTimeout('animate()', 10);
}
if((pic1.style.posLeft <= pic2.style.posLeft+pic2.style.posHeight)&&(pic1.style.posLeft >=pic2.style.posLeft) && (pic1.style.posTop<=pic2.style.posTop+pic2.style.posWidth && pic1.style.posTop>=pic2.style.posTop))
{
clearTimeout(id1);
clearTimeout(id2);
clearTimeout(id3);
}
</script>
</HEAD>
<BODY OnLoad="getwindowsize()" OnResize="getwindowsize()" background="spc3.gif">
<div id="pic1" style="position:absolute; visibility:visible; left:0px; top:0px; z-index:-1">
<img src="ufo.gif" width=70 height=70 border="0">
</div>
<div id="pic2" style="position:absolute; visibility:visible; left:0px; top:0px; z-index:-1">
<img src="kap.gif" width=40 height=40 border="0">
</div>

<script>
var pic1=document.all.pic1.style;
var pic2=document.all.pic2.style;
</script>
[/Highlight]

Thread: collision detection

Thread Tools

Display

collision detection

Posting Permissions