Dan's Layers Tutorial
4.4  Known Problems with Layers

There are a few bugs in Netscape 4 that I and a few others have discovered. I would like to keep track of these types of bugs, so if you discover any others please notify me of it.

Sliding Animated GIF's

Showing animated GIF's in layers is no problem. But once you start moving the layer around you'll notice that your animated GIF will all of a sudden stop looping when there is no reason why it should.

Click here to view an example that will illustrate this problem. Once you click the hyperlink it calls a function to slide the layer. The animated GIF will stop looping at some point in the middle of the slide. And it always stops on the same frame - the last frame in the animated GIF. The problem seems to only occur when you execute the function by a hyperlink, or call it from another function.

There are 2 workarounds for this problem. 1) You can automatically execute the function by using a setTimeout(), or onLoad. Or 2) You can preload the animated GIF and reload it just before you start the slide. This will cause your GIF to "jump" back to the first frame, but I don't think there's any better way to do it. Click here to view the fixed version.

Changing Multiple SRC's

If you're using external files for the content of your layers, and you want to change the src's, then you must be aware of this bug. When you try to execute 2 src changes one after the other it will not change the second one.

function change() {
	document.layers["layer1"].src = "3.html";
	document.layers["layer2"].src = "4.html";	// does not execute
}
Click here to view an example that will illustrate this problem.

The reason for this seems to be that Netscape reads over commands too quickly and skips the second one. So the workaround is to delay the second command using a setTimeout(). Click here to view the fixed version. I'm not sure if this is an isolated problem, or if it affects other commands.

Forms, Applets and Plugins

Netscape admits on their web site that layers and "windowed elements" (forms, applets, and plugins) don't get along so well.

For example if you show a layer with a form elements, and you have a layer that overlaps it, the form elements will show through. Click here to see what I mean.

A minor thing that you'll notice in that example that the color on the edges of a radio button or checkbox is the same as the background color - NOT the background color of the layer it is shown in. The workaround is to set your background color to whatever you want the radio button to be, and then show a layer that covers the whole screen in a different color.


Dan's Layers Tutorial
1.1 Introduction
1.2 Overlapping
1.3 Nesting
1.4 Using JavaScript
2.1 Sliding Layers
2.2 Pre-Built Functions
2.3 Clipping Layers
2.4 Looping Animations
2.5 Changing Images
3.1 Mouse-Click Animation
3.2 Capturing Keystrokes
3.3 Drag and Drop
4.1 Making Demos
4.4 Problems
4.5 Screen Sizes


Copyright © 1997 Dan Steinman. All rights reserved.