if i have 2 divs (z index is not assigned), one layered over the over, can i use the reference to the top div to find which div is below it?
as far as the DOM structure goes, these two divs would be siblings. but visually they are stacked on one another.
here's an example:
<body>
<div id="box1" style="background:#e0e0e0;height:100px;width:100px;"></div>
<div id="box2" style="background:#000000;height:100px;width:100px;margin-top:-50px;"></div>
</body>
which results in this:
so i'm trying to figure out, when having the black div, box2, a way to return box1 in jquery (using selectors), because box1 is beneath box2, using jquery.
You can use find option to select an element inside another. For example, to find an element with id txtName in a particular div, you can use like ....but $ ('span', $ ('#foo')); doesn't work? This method is called as providing selector context. In this you provide a second argument to the jQuery selector.
jQuery find () Method 1 Syntax. The description of these parameters is given below. ... 2 jQuery find () Method to Find Descendant an Element. If you want to get the specified descendant elements for the selected element, you have to use the method as given ... 3 Return All Descendant Elements. ...
How to finds all elements that are empty in jQuery ? - GeeksforGeeks How to finds all elements that are empty in jQuery ? In this article, we will see how to find all elements on the page that are empty using jQuery. Approach 1: The :empty selector can be used to get all elements in the page that are currently empty.
In the case of <tr> jQuery does check the CSS display property, and considers an element hidden if its display property is set to none. Elements that have not been added to the DOM will always be considered hidden, even if the CSS that would affect them would render them visible.
Check if box1
is sharing the same position as a certain spot on the page.
And only because I'm a little bored, I made this awesome-er
http://jsfiddle.net/hunter/PBAb6/
function GetAllElementsAt(x, y) {
var $elements = $("body *").map(function() {
var $this = $(this);
var offset = $this.offset();
var l = offset.left;
var t = offset.top;
var h = $this.height();
var w = $this.width();
var maxx = l + w;
var maxy = t + h;
return (y <= maxy && y >= t) && (x <= maxx && x >= l) ? $this : null;
});
return $elements;
}
Maybe something along these lines... detach the element under your cursor (in this case box1) and use document.elementFromPoint to fetch the next element underneath that x,y position.. rough example:
var first_box = $('#box1');// more programmaticaly would be to use document.elementFromPoint to fetch the element under your cursor
var first_box_offset = first_box.offset();
var x = first_box_offset.left;
var y= first_box_offset.top + first_box.height();
var reattach_me = first_box.detach();
var second_box = document.elementFromPoint(x, y);
$('body').append(reattach_me);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With