The event object is a subsidiary object of window, but we won't spend too much time covering it here. Instead, we'll wait for chapter 5 when we talk more about scripting, as this is when the properties will come in to use – in conjunction with the events that have been triggered by the browser and identified in the scripting code.
The objects we've talked about so far generally have reflected concrete parts of the window or browser. Many of them can't even be changed, and they're all around at all times for querying if not modifying. The event object, in contrast, is a much more ephemeral beast. It furnishes specific information about the event last fired by the browser and can and will be very different from one instant to the next. The different properties of event tell things like the state of the Ctrl, Alt, and Shift keys when the event was first fired, whether or not any mouse buttons were pressed, and so on.
| Property | Value |
altKey |
The state of the Alt key |
button |
The mouse button(s), if any, that was (were) pressed to fire the event |
cancelBubble |
Stops the current event from bubbling up the hierarchy |
clientX |
The x coordinate of an element, excluding borders, margins, scrollbars etc |
clientY |
The y coordinate of an element, excluding borders, margins, scrollbars etc |
ctrlKey |
The state of the Ctrl key |
fromElement |
Specifies the element being moved from (for onmouseover and onmouseout events) |
keyCode |
ASCII code of the key being pressed (if a key has been pressed) |
offsetX |
the x coordinate of the mouse pointer when an event occurs, relative to the containing element |
offsetY |
The y coordinate of the mouse pointer when an event occurs, relative to the containing element |
returnValue |
Sets the return value for the event |
screenX |
The x coordinate of the mouse pointer when an event occurs, relative to the screen |
screenY |
The y coordinate of the mouse pointer when an event occurs, relative to the screen |
shiftKey |
The state of the Shift key |
srcElement |
The deepest element that the event occurred over |
srcFilter |
Specifies the filter that caused the element to produce an onfilterchange event |
toElement |
Specifies the element being moved to (for onmouseover and onmouseout events) |
type |
Returns the name of the event as a string, without the on prefix, such as mouseover instead of onmouseover |
x |
The horizontal position of the mouse in window coordinates (pixels) |
y |
The vertical position of the mouse in window coordinates (pixels) |
This object is extremely useful when we write script code and perform exotic sounding things like 'event-bubbling', however we'll avoid discussing any of the properties until chapter 5 of this book, as you'll need to understand how events can be caught by your scripting code first.