function checkCollisions(x1, y1, w1, h1, x2, y2, w2, h2){
if (x1 + w1 >= x2 && x1 + w1 <= x2 + w2 && y1 + h1 >= y2 && y1 + h1 <= y2 + h2) {
return true;
} else if (x1 >= x2 && x1 <= x2 + w2 && y1 >= y2 && y1 <= y2 + h2) {
return true;
} else {
return false;
}
}
let a = document.querySelector('.Div1')
let b = document.querySelector('.Div2')
setInterval(function(){
let d1P = a.getBoundingClientRect()
let d2P = b.getBoundingClientRect()
let TopLeftCornerBoxA = d1P.x
let TopRieghtCornerBoxA = d1P.x+d1P.width
let TopLeftCornerBoxB = d2P.x
let TopRieghtCornerBoxB = d2P.x+d2P.width
let TopLeftCornerBoxHeightA = d1P.y
let BottonLeftCornerBoxHeightA = d1P.y+d1P.height
let TopLeftCornerBoxHeightB = d2P.y
let BottonLeftCornerBoxHeightB = d2P.y+d2P.height
// console.log('///////////////')
// console.log(TopLeftCornerBoxA)
// console.log(TopRieghtCornerBoxA)
// console.log(TopLeftCornerBoxB)
// console.log(TopRieghtCornerBoxB)
// console.log('///////////////')
// console.log(TopLeftCornerBoxHeightA)
// console.log(BottonLeftCornerBoxHeightA)
// console.log(TopLeftCornerBoxHeightB)
// console.log(BottonLeftCornerBoxHeightB)
// console.log('///////////////')
if(
TopRieghtCornerBoxA>=TopLeftCornerBoxB && TopLeftCornerBoxA<=TopRieghtCornerBoxB
BottonLeftCornerBoxHeightA>=TopLeftCornerBoxHeightB && TopLeftCornerBoxHeightA<=BottonLeftCornerBoxHeightB
){
a.style.backgroundColor = "#cf8"
b.style.backgroundColor = "#cf8"
}else{
a.style.backgroundColor = "#red"
b.style.backgroundColor = "#blue"
}
},1)