I had an error in my original test script. Here is the revised one. Sorry.
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function moveTheLowIFrameHost()
{
alert( "moving theLowIFrameHost (right) almost completely 'under'
theHighIFrameHost (left)" );
window.document.getElementById('theLowIFrameHost').style.left = '50px';
window.setTimeout( "afterMoveTheLowIFrameHost();", 1000 );
}
function afterMoveTheLowIFrameHost()
{
alert( "notice that although theLowIFrameHost has a lower z-order, " +
"it appears on top of the item with the higher z-order" );
window.setTimeout( "moveTheHighIFrameHost();", 1000 );
}
function moveTheHighIFrameHost()
{
alert( "moving theHighIFrameHost (contains red text) back to where " +
"theLowIFrameHost (contains black text) originally was (ie: the
right)" );
window.document.getElementById('theHighIFrameHost').style.left = '500px';
window.setTimeout( "afterMoveTheHighIFrameHost();", 1000 );
}
function afterMoveTheHighIFrameHost()
{
alert( "notice that the contents of theHighIFrameHost are still
corrupted" );
alert( "dynamically changing z-order makes no difference at run-time -
the last iframe/div moved is always on top" );
}
function Body_OnLoad()
{
if( navigator.appName.charAt(0) == 'N' )
{
window.top.theHighIFrame.document.documentElement.innerHTML =
"<FONT COLOR=\"Red\">This IFrame has a high z-order.</FONT>";
window.top.theLowIFrame.document.documentElement.innerHTML =
"This IFrame has a low z-order.";
}
else
{
window.top.document.frames["theHighIFrame"].document.body.innerHTML =
"<FONT COLOR=\"Red\">This IFrame has a high z-order.</FONT>";
window.top.document.frames["theLowIFrame"].document.body.innerHTML =
"This IFrame has a low z-order.";
}
window.setTimeout( "moveTheLowIFrameHost();", 1000 );
}
</SCRIPT>
</HEAD>
<BODY
ONLOAD="JavaScript:Body_OnLoad();">
<DIV
ID="theHighIFrameHost"
STYLE="position:absolute;left:5px;top:5px;z-index:100;">
<IFRAME NAME="theHighIFrame"
STYLE="position:absolute;z-index:100;"></IFRAME>
</DIV>
<DIV
ID="theLowIFrameHost"
STYLE="position:absolute;left:500px;top:5px;z-index:10;">
<IFRAME NAME="theLowIFrame"
STYLE="position:absolute;z-index:10;"></IFRAME>
</DIV>
</BODY>
</HTML>
"Anthony Evans" <[EMAIL PROTECTED]> wrote in message
8Ohk6.624$[EMAIL PROTECTED]">news:8Ohk6.624$[EMAIL PROTECTED]...
> Greetings
>
> In NN6.01, If one dynamically moves an IFRAME (embedded in a DIV) with a
low
> Z-Order over an IFRAME embedded DIV with a high Z-Order, one expects that
> the IFRAME embedded in the DIV with the high Z-Order will appear on top.
>
> Well, regardless of the Z-Order of the frames, the most recently moved one
> is the one that appears on top (with the border partially erased,
> cooincidentally - like the IFRAME border obeys the z-order, but not the
> IFRAME).
>
> If one follows this experiment by dynamically moving the IFRAME with the
low
> Z-Order out from "behind" the IFRAME with the high Z-Order, it drags the
> content of the overlapping IFRAME with it, corrupting the original
contents.
>
> I have inferred from posts by others that there may be a bug in how
Netscape
> 6.01 handles IFRAME z-orders, but why would this apply to DIVs? Is there
a
> work around? Am I doing something wrong?
>
> The following script demonstrates the problem. I'll appreciate any
insight
> you might have. If you think there's a better place to post this
question,
> please give me a shove in the right direction.
>
> Thanks
> Tony
>
> <HTML>
> <HEAD>
> <SCRIPT LANGUAGE="JavaScript">
> function moveTheLowIFrameHost()
> {
> alert( "moving theLowIFrameHost (right) almost completely 'under'
> theHighIFrameHost (left)" );
> window.document.getElementById('theLowIFrameHost').style.left = '50px';
> window.setTimeout( "afterMoveTheLowIFrameHost();", 1000 );
> }
>
> function afterMoveTheLowIFrameHost()
> {
> alert( "notice that although theLowIFrameHost has a lower z-order, " +
> "it appears on top of the item with the higher z-order" );
> window.setTimeout( "moveTheHighIFrameHost();", 1000 );
> }
>
> function moveTheHighIFrameHost()
> {
> alert( "moving theHighIFrameHost (contains red text) back to where " +
> "theLowIFrameHost (contains black text) originally was (ie: the
> right)" );
> window.document.getElementById('theHighIFrameHost').style.left =
'500px';
> window.setTimeout( "afterMoveTheHighIFrameHost();", 1000 );
> }
>
> function afterMoveTheHighIFrameHost()
> {
> alert( "notice that the contents of theHighIFrameHost are still
> corrupted" );
> alert( "dynamically changing z-order makes no difference at run-time -
> the last iframe/div moved is always on top" );
> }
>
> function Body_OnLoad()
> {
> window.top.theHighIFrame.document.documentElement.innerHTML =
> "<FONT COLOR=\"Red\">This IFrame has a high z-order.</FONT>";
> window.top.theLowIFrame.document.documentElement.innerHTML =
> "This IFrame has a low z-order.";
> window.setTimeout( "moveTheLowIFrameHost();", 1000 );
> }
> </SCRIPT>
> </HEAD>
> <BODY
> ONLOAD="JavaScript:Body_OnLoad();">
> <DIV
> ID="theHighIFrameHost"
> STYLE="position:absolute;left:5px;top:5px;z-order:100;">
> <IFRAME NAME="theHighIFrame"></IFRAME>
> </DIV>
> <DIV
> ID="theLowIFrameHost"
> STYLE="position:absolute;left:500px;top:5px;z-order:10;">
> <IFRAME NAME="theLowIFrame"></IFRAME>
> </DIV>
> </BODY>
> </HTML>
>
>
