Please take a look at the picture below:
It is and attempt in creating a "game" only with the DOM and jQuery.
The blue boxes are "obstacles" and the user can move his pointer (not drawn in screen in the picture", which is a single point, by clicking where he wants it to go.
The problem I am facing now, it to create a collision detection in the DOM itself with jQuery only. I am not using a pathfinding: that means that if a user wants to go across an obstacle, he has to click all the way around it. Now, how do I check if there will be a collision BEFORE the pointer actually collides? Another problem that might arise from this is if a user clicks on the opposite side of the obstacle, the collision would be checked and just walk past by.
Thanks in advance.