Question

I’m trying to figure out a way to select elements that are overlapped (and contained, completely covered up) within an absolutely positioned div.

I basically need to select elements within a certain pixel boundary. How can this be done using jQuery?

Answer 1

Here’s the basic idea:

var left = 100,
    top = 200,
    right = 300,
    bottom = 500;

$('#main-div').children().filter(){
    var $this = $(this),
        offset = $this.offset(),
        rightEdge = $this.width() + offset.left,
        bottomEdge = $this.height() + offset.top;

    if (offset.top > top && offset.left > left && right > rightEdge && bottom > bottomEdge) {
        return true;
    }

    return false;
});

Change the coordinates at the top to whatever you need.