Previous Message
Next Message

'popup menu' and select problems

Sent by Tony Garcia on 20 September 2005 23:11


Well, it's not quite as simple as that :(

I have some popup menus that I'm trying to get to display properly in IE 
6, with a drop-down "select" list underneath. This problem appears to be 
well-known, and I found plenty of info on using IFRAME to get around it.

The problem that I'm having is that the IFRAME won't go behind the 
popup. Even if the popup DIV z-index is 100 and the IFRAME z-index is 1, 
the IRFAME still displays in front of the DIV. I fixed this partially by 
making the IFRAME transparent, but that only allows me to see the menu 
items - the rollovers don't work, and I can't click on them.

I have a slight suspicion that this is due to the Position styles on all 
the parent elements. I was wondering if anyone may be able to confirm that?

A little psuedo-html  to get the idea of the layout:

<div class='container'>
   <div class='header'>
      //header stuff here
   </div>
   <div class='menubar'>
      <span class='menuIten' style='position:relative;'>Dropdown Menu
         <div class='dropdown' style='position:absolute;z-index:100;' 
onClick='javascript:doPopup()'>
            <a class='dropdownItem' href='#'>Item 1</a>
            <a class='dropdownItem' href='#'>Item 2</a>
            <a class='dropdownItem' href='#'>Item 3</a>
         </div>
      </span>
   </div>
   <div class='formStuff'>
      <select>
         <option value='1'>Option 1
         <option value='2'>Option 2
         <option value='3'>Option 3
      </select>
   </div>
</div>
<iframe style='position:absolute;z-index:10;'>
   //This is resized and moved by javascript:doPopup()
</iframe>

I have no problem getting the IFRAME and menu DIV to line up, but the 
IFRAME is always in front. Will I need to declare position: for all 
parent elements of the menu DIV?

TIA,

(btw, I guess I should say 'hi', too!)

Tony

______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message