Sorry if I am using the terms wrong…im more of a flash guy so swap depth makes sense lol. Anyway, I have a video player with a lights buttons. It uses External Interface to dim some DIVs around the player that acts like Hulu’s lights feature.
I have some text that I need to stay above the dimming DIV, except the div that I need to stay on top is located below the DIV that dims:
<body onResize="getBottomHeightViaResize();" onload="getName();" onunload="return window_onunload();">
<div id="fade_top" class="black_overlay_top" style="display: none;position: absolute;top: 0%;left: 0%;width: 100%;height: 88px;background-color: #000;z-index:1001;-moz-opacity: 0;opacity:.0;filter: alpha(opacity=0);"></div>
<div id="wrapper">
<div id="header">
<div id="logo"><img src="images/logo.jpg" width="313" height="81" title="POST Video Training On Demand" /></div>
<div id="controls">
<div id="usernav">
<div id="usernavtext" align="center"><span class="usertext"><span id="idtext"></span><!-- | <a href="javascript:void(0);">Logout</a>--></span></div>
</div>
fade_top is the div that fades. I need the usernav to stay visible even when that fades. Is their a css property I can set to make that usernav div stay above everything even though hierarchically it is below the fader?