Eslam Zedan
2 Mar 2022
Javascript
I Want To check if my div have touch another div
here is my Work
$(document).mousemove(function(event){
if(getmouse){
var newX= event.pageX-20;
var newY= event.pageY-20;
$('.mybox').css('left',newX + "px");
$('.mybox').css('top',newY+ "px");
var checkY = parseInt($('.box1').css('top').slice(0,-2));
var checkX = parseInt($('.box1').css('left').slice(0,-2));
var padingval = parseInt($('.box').css('padding').slice(0,-2))*2;
console.log(checkY+padingval+" - "+newY);
if((newY==checkY&&newX==checkX)||newY+20<checkY-padingval
||newY-20<checkY+padingval)
{
alert('Game Over');
getmouse = false;
$('.mybox').css('top',"240px");
$('.mybox').css('left',"420px");
}
}
})
if My div Touch any div it Must alert Game over and return to its place I have checked if it touched first box but if there is any simple way to check ?
Rakshit
3 Mar 2022
Your need is to find the overlap between HTML elements.
To achieve your requirements, you need to use some readymade API like jQuery Collision API.
var isCollisionOccurred = $("#box1").collision(".box2");
Visit documentation for more details: Collision API Doc & Usage for collision library.
You can check which div is inside and outside of the block when you drag and drop it through the canvas or your window boundary. Visit above links to see more about the API capabilities.
Reference: [Thread1]
© 2024 Copyrights reserved for web-brackets.com