onMouseOver Event
|
Type=banner Justify=left 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! |
Take Care Not to Render in <HEAD> Section
While the next problem is really an obvious coding error and not a browser problem, sometimes it may not be obvious when that one has done this. YAMF uses the document.write() method to create the DHTML image containers. Basically, there is a function that generates these containers (layers) using the Space character (white space) with the style sheet visibility property initially set to invisible (or hide in the case of Netscape 4.) This occurs as soon as the page is loaded and then the Space images are replaced with ones pointed to by an arbitrary message string after the page has loaded. Thus, the initial load was set up to not display any images until such time as the main function was called.
Now, I had developed this part of the script near the start of the design effort and had neglected to make note of the fact that images were being rendered during the page load. Also, this function has a number of global flags that are set during its load and used throughout the program. So, when it came time to decide where to load this script, my natural inclination was to put it in the document’s <HEAD> section, which is what I had done. As with many other problems I uncovered during my diagnostic phase, the program worked on some browsers (Netscape 6 and Internet Explorer 5/6) but failed to work on others (Netscape 4.) Making matters worse, it didn’t log any errors on the JavaScript console to give me a clue where the problem existed, either. After several hours of analyzing the script, it finally dawned on me that images were being rendered in the <HEAD> section. Moving the script loading to the <BODY> section solve this problem.
As stated up front, this is really a script coding error and the fault of the programmer (euphemism to provide cover for author.) So, if your script isn’t working and you are not getting any JavaScript errors to assist in finding the problem, review your code to ensure that no elements are being rendered in the <HEAD> section.
Automatic Expansion of Relative URLs
This next issue is more a revelation than a problem and has to do with how relative URL references are stored. The most likely use of these is when one pre-caches images using JavaScript, as shown below:
var myImage = Image(); myImage.src = "images/MyImage.gif"; |
While you might think that the myImage.src property contains the relative URL text string after the assignment, you might be mistaken. Internet Explorer and Netscape 4 actually expand the relative URL to its fully qualified absolute URL value, e.g.,
http://www.SomeDomain.com/images/MyImage.gif as part of the assignment process; while, Netscape 6 leaves it in its relative state. Under normal circumstances, this is not an issue since use of an automatically expanded URL is just as valid as its shortened relative one. However, if for any reason one has to rely on the original form of the URL (to determine which method was used to define the URL, for example) then the script cannot expect the original value to be contained in the myImage.src property.| Previous | Next |
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
onMouseOver Event
|
Type=banner Justify=left 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! |
onMouseOver Event
|
Type=banner Justify=left View=visible Rate=50 XGapAdj=0 IPath=images/ IExt=gif angAware=false |
Effect=dither Direction=left Angle=225.0 Scale=1.0 YGapAdj=0 IPrefix=yamf Reverse=false YAMF OFF! |
onMouseOver Event
|
Type=banner Justify=left View=visible Rate=50 XGapAdj=0 IPath=images/ IExt=gif angAware=true |
Effect=dither Direction=left Angle=315.0 Scale=1.0 YGapAdj=0 IPrefix=yamf Reverse=false YAMF OFF! |