home.


Javascript: Do two elements overlap?


Pass the following two HTML elements.
 
It returns a boolean if the rectangles overlap or not.
 
getBoundingClientRect is great. It gives you the fixed position of elements.

var rect_in_rect = (element1, element2) => {
    var rect1 = element1.getBoundingClientRect(); 
    var rect2 = element2.getBoundingClientRect()
    return rect1.right >= rect2.left && rect1.left <= rect2.right &&
        rect1.bottom >= rect2.top && rect1.top <= rect2.bottom
}

javascript


Edit on Github!

comments powered by Disqus