Event Capturing - Netscape 4

This page is about general event capturing in Netscape 4 and about how Netscape's official documentation is wrong.
Other browsers will get separate pages later on.

Please note that Netscape's Event Capturing and Event properties pages are incomplete, often vague and sometimes simply wrong. This page is based on the actual behaviour of Netscape 4 on my computers.

This page is not yet finished, no doubt I will have to adjust some details! Check back regularly if you want to use the bits of script on this page.

First some quick words about the theory, then on to practice with a table that describes the events as they actually are. Then you need to learn how to assign a function to an event. Then it's time to review the differences between events that don't need to be captured and events that do need to be captured. Finally a quick example of a function that is called by an event. This includes a table of available properties.

Theory

The situation around Netscape 4 and its general event capturing is vague and troubled, to say the least. The theory wants that you first capture an event, like

document.captureEvents(Event.MOUSEUP);

and then define a function to be executed whenever the event is captured, like

document.onmouseup = up1;

Thus defined, whenever a mouseup event occurs the function up1() is executed. You can also stop an event from being captured by:

document.releaseEvents(Event.MOUSEUP);

So much for theory, now on to practice.

Practice

For some reason, neither Netscape's official documentation nor the numerous tutorials based on it mention the fact that events can be split into two groups: those that don't need to be captured and those that do need to be captured. There are some important differences in the handling of these two groups of events.

Assigning event handling functions

As an example, let's take a page that has a layer in it. In the context of event capturing, such a layer must have position: absolute in the style sheet.

----------------------------------------------------
|                                                  |
|                   document                       |
|                                                  |
|        --------------------------                |
|        |                        |                |
|        | document.layers['id']  |                |
|        |                        |                |
|        |                        |                |
|        |                        |                |
|        --------------------------                |
|                                                  |
----------------------------------------------------

Now we can define event handling functions for both the document and the layer. For instance, in case of MouseUp:

document.onmouseup = up1;
document.layers['id'].document.onmouseup = up2;

up1() is executed when a mouseUp event occurs in the document, up2() when the event occurs in the layer. So generally it's possible to assign events to either the document or a layer.

There are some differences between the events that need to be captured and those that don't need to be captured. Let's review them.

Capturing not necessary

Click, Dblclick, MouseDown, MouseUp, KeyDown, KeyPress, KeyUp.

These events do not need to be captured, although capturing them can in some cases be a good idea.

Let's continue with the example above:

document.onmouseup = up1;
document.layers['id'].document.onmouseup = up2;

If we define it like this, the document and the layer have their own, separate mouseup event, so the layer is not considered part of the document, even though an event is supposed to be captured by the highest-level structure (document, in this case) first.

A problem here: Netscape 4 on Windows and Linux do not consider text as part of the layer, while Netscape 4 on Mac does. So if you click on any text in the document or the layer, Windows and Linux ignore it while Mac uses the event handler we defined. This problem is solved by adding any captureEvent, whether on document level or on layer level.

Now if we add

document.captureEvents(Event.MOUSEUP);

the situation radically changes. Now the document is considered to 'cover up' the layer, so that when you click on the layer, the mouseup event is first sent to the general document.onmouseup and up1 is executed. Of course, if no mouseup event handler is defined for the document, nothing happens.

We can also do

document.layers['id'].document.captureEvents(Event.MOUSEUP);

Now the document and the layer still have their separate mouseup event but the text bug mentioned above is solved.

When releasing an event, the situation is more complicated. When you release the event in the document, like

document.releaseEvents(Event.MOUSEUP);

the advantages of the capturing are cancelled again. But releasing the events in the layers doesn't have any effect.

Capturing necessary

Blur, Change, Focus, MouseMove, MouseOut, MouseOver

These events have to be captured before you can assign functions to them. When they're released again, the functions are not called any more. In fact, these events behave as theory says they should behave.

To assign event handling functions to a layer only, do something like:

document.layers['id'].document.captureEvents(Event.MOUSEOVER);
document.layers['id'].document.onmouseover = function;

Most of these events don't work on every element, see the table above for details.

The function

Now to the function itself. The event is automatically passed to the function and you have to assign it to a variable. The standard is:

function up1(e)

The e is a habit only, you can use any variable name you like.

Now e contains the event and you can read out some properties. For instance,

function up1(e)
{
	var x = e.pageX;
}

Now x contains the x coordinate of the mouse pointer when the event was fired.

Netscape has a list of properties and values that has been prodigiously copied but unfortunately is very unclear sometimes. So here's my own table:

Enough for now, you now understand the problems with event handling in Netscape 4.

Home