Javascript Collision detection using ID's

enox10mx

New Member
Messages
29
Reaction score
0
Points
0
Hello.
I am making a game with javascript, and need to know how to make two images touch each other.
Each image is inside a div with an ID of:
Code:
player
or
Code:
wall
.
Here is the page's code:
HTML:
<head><style>DIV.movable { position:absolute; }</style><script type="text/javascript" src="http://www.openjs.com/scripts/events/keyboard_shortcuts/shortcut.js"></script></head><body><div id="player" class="movable"><img src="http://eno.x10.mx/favicon_pakkit.png"></div>
<br />
<br />
<div id="wall" class="movable"><img src="wall.png"></div>
<br /><script language="javascript">document.getElementById("ufo").style.top  = 1;document.getElementById("ufo").style.left = 1;var position;var pos2;pos2 = 1;position = 1;function movemedown()  {position = position + 5;document.getElementById("ufo").style.top  = position;document.getElementById("ufo").style.left = pos2;}function up()  {position = position - 5;document.getElementById("ufo").style.top = position;}function left()  {pos2 = pos2 - 5;document.getElementById("ufo").style.left = pos2;}function right()  {pos2 = pos2 + 5;document.getElementById("ufo").style.left = pos2;}shortcut.add("Ctrl+Down",function() {    movemedown();});shortcut.add("Ctrl+Up",function() {    up()});shortcut.add("Ctrl+Left",function() {    left();});shortcut.add("Ctrl+Right",function() {right();});</script><br /><br /><br /><br /><br /></body>
Ignore the "shortcut.add" and the excessive BR's, but that's my page.
May somebody help me do collision checking.
 
Last edited:

miguelkp

Member
Messages
304
Reaction score
7
Points
18
I guess you should give this a try:

http://gamequeryjs.com/

gameQuery is an easy to use jQuery plug-in to help make javascript game development easier by adding some simple game-related classes. If you know how to use jQuery you almost know how to use gameQuery! To learn more go to the documentation page. The project is hosted on GitHub and you can follow it on a twitter page for the daily progress of the development.


gameQuery has the following features:
  1. multi layer-sprite animations
  2. sprite hierarchies (grouping)
  3. collision detection
  4. swappable sound support
  5. periodic callbacks
  6. keyboard state polling
  7. free and open source license
 
Last edited:

descalzo

Grim Squeaker
Community Support
Messages
9,373
Reaction score
326
Points
83
http://jquery.com/

jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript.
 

enox10mx

New Member
Messages
29
Reaction score
0
Points
0
I figured that out before i looked at the answer here by googling it.
I find it useless anyway because I cannot find the collision detection function.
May somebody please give me the code for a function that runs another function when objects with certain ID's hit each other.
example for a function:
Code:
onhit("id1","id2","dothisfunction();");
 

enox10mx

New Member
Messages
29
Reaction score
0
Points
0
May somebody please give me the code for a function that runs another function when objects with certain ID's hit each other.
example for a function:
Code:
onhit("id1","id2","dothisfunction();");
Please may somebody post some code as I described.
 
Messages
17
Reaction score
0
Points
1
Writing collision detection a.k.a. does x overlap y (or would it if the items continued to move).

If you're programmatically moving an object around the screen then presumably you know an x,y, location of one of its corners?

If you know an (x,y) co-ord, and you know both the height and width of the object then you can use that information to compute if that area is (potentially) occupying the same area as the item you want to know if it's colliding with :)
 
Top