jQuery確定2個div之間的重疊量

Question

我有兩個互相重疊的div（矩形）。如何確定JavaScript中兩個div之間的交集/重疊量？

我知道我會得到的尺寸的長方形：
offset.top，offset.left，elt.offsetWidth，elt.offsetHeight

但是從那裏我不能確定如何確定的量交疊。

Answer 1

var div1 = $('#div1'); 
var div2 = $('#div2'); 
var both = div1.add(div2); 

var leftMost = (div1.offset().left < div2.offset().left ? div1 : div2); 
var rightMost = both.not(leftMost); 
var topMost = (div1.offset().top < div2.offset().top ? div1 : div2); 
var botMost = both.not(topMost); 

var overlap = { 'x': (leftMost.offset().left + leftMost.outerWidth()) - rightMost.offset().left, 
        'y': (topMost.offset().top + topMost.outerHeight()) - botMost.offset().top };