[jQuery] z-index and IE issue (not the select problem, or the z-index stacking context)
I ran into both the select-in-IE6 issue and z-index stacking issue
(described very well here: http://www.aplus.co.yu/lab/z-pos/index.php).
But now I'm running into another issue with IE that it won't seem to
apply the z-index when it's done inside of a hover function. This
isn't a problem in FF, but is an issue in both IE6 and IE7.
I'm still working for a simple repro, but I was wondering if anyone
else has run into this?
Here's the offending code:
v.parents(".vtiproot").css({"z-index":"101"});
I get behavior in IE that tells me the z-index hasn't been applied
(the element is hidden by another element). If I force the z-index to
101 for that element in the static stylesheet or in the IE developer
toolbar, I get the correct behavior. So it seems as if the z-index
style hasn't been applied.
Other observations:
* alert(v.parents(".vtiproot").css("z-index")) shows that the z-index
is 101, but it's not behaving like it and if I force the z-index to
101 in IE developer toolbar for the element in question (".vtiproot")
I get the behavior I want
* v.parents(".vtiproot").hide().show().css({"z-index":"101"}); seems
to solve the problem (but is a hack)
* v.parents(".vtiproot").css({"z-index":"101", "display":"block"});
also seems to solve the problem the first time I call it, but the
second time I need to do it doesn't work anymore.
I'm working on isolating the problem and will try to post a simple
repro.