DIV Tag Not on Top Z-Index Order Problem?

#1 July 24th, 2005, 12:57 AM

I have this in my <head> tag:

<script type="text/javascript">
function overlay() {
document.getElementById("divoverlay").style.visibi lity = "visible";
}
</script>

And this in my <body>:

<div id="divoverlay">
<span id="spantext"
style="position:absolute;top:40%;right:30%;vertica l-align:middle;">
P L E A S E W A I T
</span>
</div>

And in the onClick of a button the div shows and overlays the entire
page. Almost. The listboxes and drop-down lists still show above the
"please wait" layer, even though their z-index is specifically set to 3
and the divoverlay z-index is 67.

Viewing with IE 6, latest version on WinXP-SP1.

What can I do to truly keep the "please wait" layer on top?

Thanks.

#2 July 24th, 2005, 12:57 AM

bradwiseathome@hotmail.com wrote:
[color=blue]
>I have this in my <head> tag:
>
><script type="text/javascript">
> function overlay() {
> document.getElementById("divoverlay").style.visibi lity = "visible";
> }
> </script>[/color]

Doesn't seem relevant to the problem in question.
[color=blue]
> And this in my <body>:
>
> <div id="divoverlay">
> <span id="spantext"
>style="position:absolute;top:40%;right:30%;vertic al-align:middle;">
> P L E A S E W A I T
> </span>
> </div>
>
> And in the onClick of a button the div shows and overlays the entire
>page. Almost. The listboxes and drop-down lists still show above the
>"please wait" layer, even though their z-index is specifically set to 3
>and the divoverlay z-index is 67.[/color]

Select elements are often rendered over the entire page and hence are
on top of the whole z-index stack.
[color=blue]
> Viewing with IE 6, latest version on WinXP-SP1.
>
> What can I do to truly keep the "please wait" layer on top?[/color]

Nothing. Best you can do is make sure that your 'please wait' and your
select elements are placed so as that they don't overlap (as best you
can allowing for the flexible nature of web pages).

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve@pugh.net> <http://steve.pugh.net/>

#3 July 24th, 2005, 12:59 AM

<bradwiseathome@hotmail.com> wrote in message
news:1111788232.522719.41790@o13g2000cwo.googlegro ups.com...[color=blue]
>
> I have this in my <head> tag:
>
> <script type="text/javascript">
> function overlay() {
> document.getElementById("divoverlay").style.visibi lity = "visible";
> }
> </script>
>
>
> And this in my <body>:
>
> <div id="divoverlay">
> <span id="spantext"
> style="position:absolute;top:40%;right:30%;vertica l-align:middle;">
> P L E A S E W A I T
> </span>
> </div>
>
>
> And in the onClick of a button the div shows and overlays the entire
> page. Almost. The listboxes and drop-down lists still show above the
> "please wait" layer, even though their z-index is specifically set to 3
> and the divoverlay z-index is 67.
>
> Viewing with IE 6, latest version on WinXP-SP1.
>
> What can I do to truly keep the "please wait" layer on top?
> Thanks.[/color]

You got me. I use Dreamweaver to add an onload script to the body. I then
add two layers (aka div) to the body, one named Load Message the other
Content. Load message is set visible and Content is set invisible. I put a
message in Load Message and put all the content in Content. When the page
loads the Content layer stays visible until Content is completely loaded,
then Load Message becomes invisible. Clear as mud right?
Signed,
me

PS: What did you think of my solution for your problem in "Stretch DIV tag
from the middle?" in this NG?

#4 July 24th, 2005, 01:01 AM

Is there a fast way to recursively disable the dropdowns and listboxes?
Then they couldn't be clicked.

Thanks.

Steve Pugh wrote:

snip

What is Bytes?

Popular Articles