views:

49

answers:

2

This gives me auto: I need the number, so I can move one above the other?

// Swop div index
$("#panel div").each(function(){
     alert($(this).css('z-index'));
});
+1  A: 

I don't think that browsers handle the z-index the way you seem to be expecting them to. For elements without a z-index, there just isn't a value there (which is basically what "auto" means).

Pointy
I suppose I could assign the z-index at the beginning of the script then or with css...
Derrick
Right - you could just assign "0" to everything that's "auto". Or, alternatively, you can just give some explicit number to the div you want to be on top, and let the other one be "auto".
Pointy
Please note that a z-index of "0" is very, very different from a z-index of "auto", since the parent element can "see" down inside of "auto" elements to see the things inside of them — so that a descendant of an "auto" div can have a z-index that refers to z-stack of the whole parent element. But an element with a "0" z-index creates a new z-stack inside of it, so that all of its descendant's z-indexes merely serve to order them within the parent element, rather than ordering them within the top-level's drawing-order context.
Brandon Craig Rhodes
@Brandon yes that's definitely true! Thanks for adding the information here.
Pointy
A: 

Elements with a z-index of auto are laid out in the order they appear in the document tree.

If you want one on top, make its z-index equal to the childNodes length of the parent. (or one more than the largest z-index of any of the child nodes, if there are any set).

Be sure to set the z-index as a string and not an integer, and parseInt to compare any existing z-indexes.

kennebec