Link to home
Start Free TrialLog in
Avatar of Tygh
Tygh

asked on

Overriding Z-Index for a Select (dropdown)

I have a menu that drops down on my screen from my header.  The problem is when it drops over a select object, the select object shows through.  Is there some way to lower the precedence of the select so the menu is on top always?

Thanks a bunch
ASKER CERTIFIED SOLUTION
Avatar of dorward
dorward

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
The z-index of the select is infinity and you cannot cannot change that behaviour.  the workarounds are:

1.  Put it in a layer and hide it when it is in the way.
2.  Put it in a layer and move it out of the way when necessary.
3.  Re-design the page to elimnate teh conflict.

If you are concerned about presentation only, then you can create a div that looks like a select and then it will participate in the stacking, but it will not be functional as a select.  To get both look and functionality from a div, take a bunch of scripting and I have not seen one yet that works reliably without cross-browser problems./

Cd&
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of SGC
SGC


I wrote the following for the exact reason you've found -- feel free to use/modify it if it suites your needs.

http://slayeroffice.com/code/dhtml_select.html

As stated at the above url, it's designed solely for IE and if you are willing to take a dhtml approach to the problem then dynamically inserting a normal select for !document.all isnt that much more of a stretch.

Hope that helps.

--steve
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
SOLUTION
Avatar of devic
devic
Flag of Germany image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
I'd argue that I did answer his question since the solution I gave works perfectly and is exactly what he needs (even if it's not exactly what he asked for)