January 15, 2001 - Retrieving Event Location | WebReference

January 15, 2001 - Retrieving Event Location

Yehuda Shiran January 15, 2001
Retrieving Event Location
Tips: January 2001

Yehuda Shiran, Ph.D.
Doc JavaScript

The e object holds a lot of information about the Netscape 6 event. The pageX and pageY properties, for example, reveals the location of the event, relative to the document's top left corner, in pixels. The following statement prints the pageX and pageY property values to the status window:

window.status = "X = " + e.pageX + "   Y = " + e.pageY;

The status window is shown on the bottom left corner of Netscape 6 window. Notice that you have to pass the e object as a parameter to those functions which reference it. In the following example, we pass the e object as a parameter to colorItTan():

<DIV ID="demoDiv" STYLE="position:relative; left:100px; top:20px; width:220px; 
height:25px; color:blue; background-color:yellow;">Click me with the left button! 
</DIV>
<SCRIPT LANGUAGE="JavaScript">
<!--
var demoObj;
function init() {
  demoObj = document.getElementById("demoDiv");
  demoObj.addEventListener("click", colorItTan, false);
}
function colorItTan(e) {
  demoObj.style.backgroundColor = "tan";
  window.status = "X = " + e.pageX + "   Y = " + e.pageY;
}
onload = init; 
// -->
</SCRIPT>

Get on Netscape 6 browser and play with this demo. Click the left button and observe the coordinates in the status window.