Reading and setting z-index values with jQuery on Webkit browsers

Question

jQuery(\"#X\").css(\"z-index\"); always returns \"auto\" on Webkit browsers. Works ok on Firefox.

It also appears that you can\'t set the z-index with s

Answer 1

try

zIndex instead of z-index.

Answer 2

You NEED to specify position to use z-index.

<h1 id="X" style='position:relative;'>Some Text</h1>

fixes it immediately in Chrome.

Answer 3

A known issue with Webkit browsers, detailed here

I understand it being confusing that the computed z-index is auto when you've specifically set one with .css, but RAMilewski makes a good point that computed z-index will be different in different browsers. We could lie (in a sense) and say that what was set is being applied so that return values are consistent, or users can realize that the z-index will not be applied without setting the other styles to make z-index work. I'm closing wontfix as I suspect this will not be something we will change, but if anyone disagrees, we can reopen in the future.

Marked resolution is Won't fix. So don't expect this to go away anytime soon.

---

Jqueryu UI's zIndex function seems to have the same problem BTW: