jquery determine amount of overlap between 2 divs

I have two开发者_StackOverflow中文版 divs (rectangles) that overlap each other. How do I determine the amount of intersection/overlap between the two divs in javascript?

I realize I'll get the dimensions for each rectangle:

offset.top, offset.left, elt.offsetWidth, elt.offsetHeight

But from there I'm unsure how to determine the amount of overlap.

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 };