documents...
displaying
a DHTML menu utilizing DIV layers on top of an IFRAME
The accepted code at experts-exchange.com does not work correctly in all browsers and platforms, so its not a very good solution.
I've created the following pages utilzing the code above and other methods for testing in your own browsers:
Test
1 (IFRAME menu above over textarea as in accepted
msa2003's 1.html code)
|
||||
Test
2 (IFRAME menu over another IFRAME - modified
version of accepted
msa2003's 1.html code)
|
||||
Test
3 (uses z-index to place IFRAME on top of DIV and vice versa
- works for IE5.5+ and partially in NS7)
|
||||
Test
4 (hide IFRAME with JavaScript and style.visibility='hidden')
|
Many solutions have been suggested:
Perhaps the easiest technique is to "...consider placing the form in a positioned element that can have visibility toggled. Then "hide" the form when other positioned elements are being dragged, and "show" it only when necessary."
Implementing this technique is described here in great detail:
To be specific though, there does not seem to be a technique or even combination of techniques that works for every browser and platform. Can anyone comment further? I'm hoping to explore the option of hiding the IFRAME using the technique in Test 4 above and utilizing a bground image for the table cell or row. I hope to do these tests soon and will post my findings here.
Update:
I have not even begun to have time to deal with this. With the project that generated this problem, I ended up using phpSniff to send the browser to seperately coded pages where problematic browsers displayed the DIV navigation rollovers above the navigation rather than below it. Seemed like the only safe solution for now, although I should update phpSniff when new browser versions come out.