A DOM1/DOM2 DHTML JavaScript Experiment

YAMF
onMouseOver Event
Type=banner
Justify=right
View=visible
Rate=50
XGapAdj=0
IPath=images/
IExt=gif
angAware=true
Effect=dither
Direction=left
Angle=45.0
Scale=1.0
YGapAdj=0
IPrefix=yamf
Reverse=false
YAMF OFF!

  

The Elusive Netscape 4 Layer Elements

While this incompatibility may be a well-known difference between Netscape 4 and standards-adherent DHTML JavaScript writers, it was a frustrating discovery for someone who recently started writing serious low-level cross-browser code. The problem has to do with how Netscape 4 encases elements (objects) contained within a layer (<LAYER>, <DIV>, <SPAN>) style sheet reference. Letís start by showing a typical non-layered element and see how it is referenced in JavaScript:

<img src="SomeImage" name="MyImage">

According to the JavaScript documentation, this object and its properties (width, height, border, etc.) can be referenced using the document.images["MyImage"].property reference and, in fact, works in all browsers tested. However, when that same element is included within a layer container, Netscape 4 no longer includes that object in the main documentís object model. Consider the following layer construction:

<div id="MyLayer" style="position:absolute">
  <img src="SomeImage" name="MyImage">
</div>

With Netscape 6 and Internet Explorer 5/6, the image elementís properties can still be referenced using the document.images["MyImage"].property reference; however, not in Netscape 4. It seems that Netscape 4ís implementation of layers actually creates a supra-document reference for its layers. So, to reference this object one must use the following JavaScript reference technique, document.MyLayer.document.images["MyImage"].property in order to locate the object and its properties.

While this difference may be plainly documented somewhere, I was unable to find it and only discovered the difference after careful review of some Netscape 4 DHMTL scripts. And, yes, this problem was further exacerbated by the fact that no JavaScript console errors were generated, the script just refused to work in Netscape 4.

PreviousNext


YAMF - "Yet Another Mouse Follower"

All Is Not What It Seems

Netscape 6 Made Me Do It!

Testing - To Reload or To Restart?

Browser Sniffing - Parse or Presence?

Avoiding JavaScript Errors on Earlier Browsers

Stopping Annoying Auto-Scroll in DOM2 Browsers

Netscape 6 is Pixel Picky

Inline Style Constraint on Internet Explorer 5

Must Use <LAYER> tag in Netscape 4 to perform DHTML

!DOCTYPE Compliance Mode

Take Care Not to Render in <HEAD> Section

Automatic Expansion of Relative URLs

The Elusive Netscape 4 Layer Elements

Temperamental onLoad After Reload

document.images[id].complete Property Dependency

Search Method Does Not Return Boolean Value

Regular Expression Global Flag Fails With Subsequent Usage

Conclusion

Resources

Downloads

Roll Your Own
  
YAMF
onMouseOver Event
Type=banner
Justify=right
View=visible
Rate=50
XGapAdj=0
IPath=images/
IExt=gif
angAware=true
Effect=dither
Direction=left
Angle=135.0
Scale=1.0
YGapAdj=0
IPrefix=yamf
Reverse=false
YAMF OFF!

YAMF
onMouseOver Event
Type=banner
Justify=right
View=visible
Rate=50
XGapAdj=0
IPath=images/
IExt=gif
angAware=true
Effect=dither
Direction=left
Angle=225.0
Scale=1.0
YGapAdj=0
IPrefix=yamf
Reverse=false
YAMF OFF!

YAMF
onMouseOver Event
Type=banner
Justify=right
View=visible
Rate=50
XGapAdj=0
IPath=images/
IExt=gif
angAware=false
Effect=dither
Direction=left
Angle=135.0
Scale=1.0
YGapAdj=0
IPrefix=yamf
Reverse=false
YAMF OFF!

Copyright © 2002-2003, ProjectIt, All Rights Reserved Last Revised: