Layer is blocked by combo box

welles · #1 Mar 30th 2005, 12:14 pm

Hi all,

I have a nevigation menu that uses javascript layer to create drop down menu effect. However, for some reason, the menu layer is blocked by the combo box on the page (in other words, the menu layer is behind the combo box). I've searched the web and found that I could set the z-index for ordering of the stack of the sibling layers. But, unfortunately, it only works for sibling layers, not combo box on the page. Can please anyone give me some directions?

Thanks,
Welles

J.D. · #2 Mar 30th 2005, 5:14 pm

Keep in mind that z-index works only for positioned elements (i.e whose position property is not static). Check the position property throughout your HTML/CSS.

J.D.

marty · #3 Mar 31st 2005, 8:56 am

The only solution I have ever found for this problem is to place the combo box within it's own div and set the combo boxes visibility to "hidden" on whatever event causes the menu layer to be displayed.

Good luck

Marty

nullbit · #4 Mar 31st 2005, 11:18 am

Marty is correct, there is no real solution to this, it's a rendering bug in IE. Either take marty's advice or move the layer so it's not in the same space as the combo-box.

J.D. · #5 Mar 31st 2005, 12:01 pm

Quote:

Originally Posted by nullbit

Marty is correct, there is no real solution to this, it's a rendering bug in IE.

I didn't know about this bug. A quick test shows that, IE simply ignores the position attribute and any relative elements following the combo box are not rendered correctly either:

Code:

<html><head>
<style type="text/css">
div {width: 100px; height: 100px; background-color: #FEE; border: 1px solid red;}
select {width: 100px; height: 100px; border: 1px solid blue; background-color: #EEF;}
</style></head><body>
<div style="z-index: 100">div1<br><strike>z-index</strike></div>
<div style="position: relative; top: -50px; left: 50px; z-index: 10;">div2</div>

<select name="cb1" style="position: relative; top: -100px; left: 100px; z-index: 20;">
	<option selected>value1</option>
	<option>value2</option>
	<option>value3</option>
</select>

<div style="position: relative; top: -150px; left: 150px; z-index: 30;">div3</div>

</body></html>

J.D.

marty · #6 Apr 1st 2005, 9:53 am

Code:

<script language="JavaScript" type="text/javascript">  	
function hide(hider)  	
{  		
    document.getElementById(hider).style.visibility = "hidden"  	
}  	
function show (shower)  
{  		
document.getElementById(shower).style.visibility = ""  	
}  
</script>    
<a onmouseout="show('001')" onmouseover="hide('001')">[hide]</a>    
<br>    
<input id="001" type="text" name="dfd">

welles · #7 Apr 4th 2005, 10:09 am

Solution found!

http://www.codingforums.com/showthr...&threadid=28261

Albertraj · #8 Sep 1st 2005, 9:46 am

Layer is blocked by combo box

--------------------------------------------------------------------------------

Hi all,

I have a nevigation menu that uses javascript layer to create drop down menu effect. However, for some reason, the menu layer is blocked by the combo box on the page (in other words, the menu layer is behind the combo box). I've searched the web and found that I could set the z-index for ordering of the stack of the sibling layers. But, unfortunately, it only works for sibling layers, not combo box on the page. Can please anyone give me some directions?

tutty · #9 Jan 4th 2006, 2:28 am

look at this:

http://www.aplus.co.yu/wch/intro/

legend2 · #10 Jan 6th 2006, 4:03 pm

bottom of the line, IE is never as we expect it to.

Eddie Traversa · #11 Jan 11th 2006, 1:00 am

active content such as forms drop down lists etc needs a specialized fix for IE that involves an iframe. See here

http://dhtmlnirvana.com/content/activecontentfix/active3.html

Eddie
http://dhtmlnirvana.com/

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Blocked Pages and Validation	Owlcroft	Co-op Advertising Network	8	Oct 5th 2006 12:31 pm
Site blocked?	sji2671	Setup / Validation Help	10	Apr 13th 2005 8:40 am
mouseover layer	tomcromp	HTML & Website Design	1	Feb 23rd 2005 11:57 am
IP address blocked?	Arnica	Setup / Validation Help	1	Jan 4th 2005 10:04 am
Requests Hang - blocked?	Jayne	Co-op Advertising Network	1	Nov 26th 2004 9:33 am