You are here: irt.org | FAQ | DHTML | Q1362 [ previous next ]
The following appears not to work correctly:
<html> <head> <script language="JavaScript"><!-- function updateLayer(layer,text) { if (document.layers) { document.layers[layer].document.open(); document.layers[layer].document.write(text) document.layers[layer].document.close(); } else if (document.all) document.all[layer].innerHTML=text; } //--></script> </head> <body> <a href="javascript:updateLayer('single','updated relative layer')">update relative layer</a> <div id="single" style="position:relative"> xxxxxxxxxxxxxxxxxxxx </div> </body> </html>
To resolve, nest the relative layer inside an absolutely positioned layer:
<html> <head> <script language="JavaScript"><!-- function updateLayer(layer,text) { if (document.layers) { document.layers[layer].document.open(); document.layers[layer].document.write(text) document.layers[layer].document.close(); } else if (document.all) document.all[layer].innerHTML=text; } function updateNestedLayer(outer,inner,text) { if (document.layers) { document.layers[outer].document.layers[inner].document.open(); document.layers[outer].document.layers[inner].document.write(text) document.layers[outer].document.layers[inner].document.close(); } else if (document.all) document.all[inner].innerHTML=text; } //--></script> </head> <body> <a href="javascript:updateNestedLayer('outer','inner','this is the new text')">update inner layer</a> <br> <a href="javascript:updateLayer('outer','destroyed inner layer')">update outer layer</a> <div id="outer" style="position:relative"> <div id="inner" style="position:absolute; left:0; top:0;"> xxxxxxxxxxxxxxxxxxxx </div> </div> </body> </html>