z-index didn't work, control cover my menu

[Eric]

Dear All,
In my Asp.net web form, the dropdownlist control always lie on the front
of the dhtml menu, how to bring my dHtml menu on the top layer. I try to
config the css "z-index", but that didn't work at all.
Any help would be great appreciate.

BTW: below is the source code

<form id="Form1" method="post" runat="server">
<table style="LEFT: 0px; POSITION:absolute;TOP: 1px;COLOR:
white;BACKGROUND-COLOR: #3f3f3f">
<tr>
<td>MenuA</td>
</tr>
<tr>
<td>MenuB</td>
</tr>
<tr>
<td>MenuC</td>
</tr>
</table>
<asp:dropdownlist id="dlKord" width="60" runat="server">
<asp:listitem>Gifts</asp:listitem>
<asp:listitem>Printing</asp:listitem>
<asp:listitem>Plastic</asp:listitem>
<asp:listitem>Rubber</asp:listitem>
<asp:listitem>Packing</asp:listitem>
</asp:dropdownlist>
</form>

[Ken Cox [Microsoft MVP]]

Windowed objects have long been a problem 'cause they "bleed" through.

WebMenu 2.0 from Coalesys is said to overlay these objects using a new
technique (haven't tried it yet myself). Maybe someone can tell us how this
magic works?

Ken

"Eric" <Eric...@hotmail.com> wrote in message
news:uaD$ja#gCHA.2240@tkmsftngp12...

[Joe King]

"Ken Cox [Microsoft MVP]" <BANSPAM...@sympatico.ca> wrote in message
news:O0sYISAhCHA.1356@tkmsftngp11...

> Windowed objects have long been a problem 'cause they "bleed" through.
>
> WebMenu 2.0 from Coalesys is said to overlay these objects using a new
> technique (haven't tried it yet myself). Maybe someone can tell us how
this
> magic works?
>
> Ken
>

Ken,

I would be happy to explain. You can see WebMenu 2.0 perform this feature
first hand here:

http://www.coalesys.com/support/kb/latest.asp

(the smaller you make the window, the easier it is to test against that
select box on the page). I'm going to put up a proper sample when I get a
moment.

Here is how it is done. The IFrame in IE 5.5 is unique, it can live in Z
order space of both windowed controls and the HTML page. In previous IE
versions, IFrame was windowed. This is the best Microsoft description I
have found:

http://support.microsoft.com/default.aspx?scid=KB;EN-US;q177378&

So what that means is an IFrame can block out the select box, and be under a
DIV at the same time. And that is how it is done. We dynamically write the
IFrame to the document, size it to the dimension of the popup DIV, and shim
between the popup DIV and the rest of the page.

There is another, more complex trick you can do. And that is to take a DIV
and copy it's inner content to the new IFrame itself, and then just start
treating the IFrame like you would have been treating the DIV. We were
doing this in our 2.0 betas, and it worked quite well. And it even works
going back to IE 4.0. However, it did require a kind of complex inter-frame
JavaScript bridge to maintain all the features in the product (Once you
write your DIV contents into the IFrame, your popup is actually a whole new
document with it's own JavaScript execution environment). Another caveat is
that in IE 5.0 and earlier, mouse over and mouse out events need to be
handled differently when the mouse is traversing frames (they don't always
fire in the expected order). So, although we had it working quite well, it
wasn't KISS. The shim technique is, so we went decided to go with that.
For IE 5.0, we continue hiding the select boxes as we have done in the past.

Regards,

Joseph King
Coalesys, Inc
http://www.coalesys.com/
ASP.NET Menus and WebControls

[Ken Cox [Microsoft MVP]]

Thanks for the explanation Joe. It still seems like magic. <grin>

Ken

"Joe King" <jk...@coalesys.spambegone.com> wrote in message
news:#v4E7tBhCHA.1364@tkmsftngp12...