Ultimate Fade-In Slide Show IE6 relative position / z-index question.

[Wildfire563]

I also had this problem so many thanks for the suggestions which led me to using "position" and an easier css solution:

div#slideshow-z-index {
position:relative;
left:0px;
top:0px;
z-index:0;
}
div#menu-z-index {
position:relative;
left:0px;
top:0px;
z-index:1;
}

I'm having the same problem. The above looks like an interesting solution, but I'm confused as to how to implement it in my code. Example web page is at http://www.flyingscool.com/indexnew.htm and http://www.flyingscool.com/index.htm.

index uses the old slideshow script and has no Doctype and works in IE8 and below but not Google Chrome or Firefox.
indexnew uses the new slideshow script and has a Doctype, and is broken in all browsers (I also tried implementing the new DHTML Window Widget in About/About, but it has the same problem)

In indexnew.htm, both the dropdown menus and the popup windows (such as About/About or About/Services) are underneath the slideshow in all browsers.

Where would I put the above CSS, and how do I use it?

As noted, in the older code in index.htm, everything works in IE8 and below, and the menus work in Google Chrome and Firefox, but not the pop up windows, hence, why I decided to redo my page. But now with the newer code, nothing is working.

This seems to be a major problem with the Ultimate Fadein Slideshow?

Sorry for the newbie questions.

[azoomer]

I think that in your case it would be easier to increase the z-index of the dropdown menu
In the indexnew.htm around line 91 change 100 to 2000 like this:

#dropmenudiv{
position:absolute;
background-color: #005EBB;
border:1px solid black;
border-bottom-width: 0;
font:normal 10px Verdana;
line-height:20px;
z-index:2000;
}

Hope that works !

[Wildfire563]

I think that in your case it would be easier to increase the z-index of the dropdown menu
In the indexnew.htm around line 91 change 100 to 2000 like this:

#dropmenudiv{
position:absolute;
background-color: #005EBB;
border:1px solid black;
border-bottom-width: 0;
font:normal 10px Verdana;
line-height:20px;
z-index:2000;
}

Hope that works !

Thank you, that fixed the drop down menus. And I figured out how to fix the new DHTML Window Widget (there is a line at the top of dhtmlwindow.js that hardcodes the z-index value. Perhaps this should be a variable for input?)

But I still can't figure out how to change the z-index of the old dhtml windows. Any thoughts on that? I've added z-index values to places that I can find in style statements in http://www.flyingscool.com/indexnew.htm, but nothing has worked yet.

[azoomer]

You could make a new css rule

#dwindow {
z-index:2000;	
}

and place it inside the <style> tags or in the external style sheet. That should make the old dhtml windows appear over the slideshow. The windows still look a little funky at the top though.

[Wildfire563]

Awesome! Thanks, that did it.

Yes, adding the doctype seems to make the interpreter more restrictive. I assume I'll just need to play around with the settings. Seems to me I remember that the numbers I was using were weird before for the size of the borders, maybe the doctype tag just made them work more correctly.

Regarding this being an old thread, I had exactly the same problem, so was that bad? Should I have just started my own thread?