faqts : Computers : Programming : Languages : JavaScript

+ Search
Add Entry AlertManage Folder Edit Entry Add page to http://del.icio.us/
Did You Find This Entry Useful?

179 of 257 people (70%) answered Yes
Recently 4 of 10 people (40%) answered Yes


Bug using div style visible, hidden over select menus, the select menu stays visible over div text
Facing an interesting problem.. I have got horizontal menus made of images which open vertically on

Apr 5th, 2008 20:00
ha mo, John Lim, qsdqsd Gapeau, Tony Crosby, Jonathan Nelson, fab dew, Rohit B,

Can't say I completely follow the question, but I'm going to go out on 
a limb here and guess.  I ran into a problem recently where I would 
set the visibility of a child to be visible, and the visibility of the 
child's parent to be hidden, and the child wouldn't go away.
What I discovered is that by setting the visibility to "visible" I was 
telling it to overwrite any visibility the parent might be saying.  So 
what I had to learn to do is never set style.visibility="visible", 
always set it style.visibility=""
By setting it to blank I tell it to be visible (er, be NOT hidden), 
but still abide by its parents control.
 I know just what he's talking about. He's saying that the <select 
menus in IE will show through a <div layer. So if you were to position 
a div layer over the form menu you would still see the form menu right 
through the layer regardless of the content of the layer.
 But still, there is very little you can do about it. The only thing I
could think of is to write a script that would hide the form using a 
div or span tag when the <div layer overlaped the layer you would put 
the select menu in. Using the visibility attribute of a div tag or the
display of a span tag.
 If the problem is what describe Tony then this is an IE bug ! IE 
(v6.0 at this time) doesn't respect z-index with <select tag. Mozilla 
doesn't have this problem.
Hope MS will correct this in next IE version because it's often 
necessary for clean DHTML menu done with <div that go over <select...
If you want you can copy www.microsoft.com : just make a small menu in 
top right conner... At this position it never go over select tag.
If the div covers the whole window, then you can hide all selects
that are not in the div.
Eg in javascript:
for (var i=0; i<document.all.length; i++) {
 o = document.all(i)
 if (o.type == 'select-one' || o.type == 'select-multiple') {
  // todo: add check for select in div?
  if (o.style) o.style.display = 'none';
John Lim