Netscape 6, Part III: The Event Model: An Example for Using the e Object - Doc JavaScript | WebReference

Netscape 6, Part III: The Event Model: An Example for Using the e Object - Doc JavaScript


Netscape 6, Part III: The Event Model

An Example for Using the e Object

The e object holds a lot of information about a Netscape 6 event. The type property reveals the event type. The example on the previous page demonstrates type values of "mouseover" and "mouseout". We added to each of the actions, colorItYellow() and colorItTan(), a statement that prints the event type in the status window:

window.status = e.type;

The status window is shown on the bottom left corner of Netscape 6 browser window. Notice that you have to pass the e object as a parameter to those functions that reference it. In our example, we added the e object to the parameter lists of colorItYellow() and colorItTan(). Here is a full listing of the new code:


<DIV ID="demoDiv" STYLE="position:relative; left:100px; top:20px;
width:120px; height:25px; color:blue; background-color:yellow;"
>Mouse over me!</DIV>
<SCRIPT LANGUAGE="JavaScript">
<!--
var demoObj;
function init() {
  demoObj = document.getElementById("demoDiv");
  demoObj.addEventListener("mouseover", colorItTan, false);
  demoObj.addEventListener("mouseout", colorItYellow, false);
}
function colorItTan(e) {
  demoObj.style.backgroundColor = "tan";
  window.status = e.type;
}
function colorItYellow(e) {
  demoObj.style.backgroundColor = "yellow";
  window.status = e.type;
}
onload = init;
// -->
</SCRIPT>

Get on Netscape 6 browser and play with this demo.

Next: How to use the e object's properties

http://www.internet.com


Produced by Yehuda Shiran and Tomer Shiran
All Rights Reserved. Legal Notices.
Created: January 1, 2001
Revised: January 1, 2001

URL: http://www.webreference.com/js/column74/6.html