HTML and CSS Reference
In-Depth Information
Now we will look at some of the properties of the event object and how they are used
to glean information about an event that has occurred. Many of the examples listed on
different Web sites might not work when you try them because they were written for a
specific client. You might be using Opera or Safari and think, “This doesn't work at all.
I give up.” But if you bring up Internet Explorer, the program seems to work fine. To see
what does or doesn't apply to your browser go to “Events Compatibility Table” at
http://www.quirksmode.org/dom/events/index.html
.
Although the DOM provides a stan-
dard model, not all browsers are compliant. We discuss the DOM in Chapter 15.
Tables 13.8 and 13.9 provide a list of the event properties for Internet Explorer and
Firefox.
Table 13.8
Properties of the
event
Object: Internet Explorer
Property
What It Describes
altKey, ctrlKey, shiftKey
Set to true or false to test if Alt, Shift, or Control keys were pressed when
the event occurred.
button
An integer indicating which mouse button was pressed or released, 1 =
left, 2 = right, 4 = middle. If multiple buttons are pressed, the value is the
sum of both buttons, such as 3 (1+2) for left and right.
cancelBubble
Set to true or false to cancel or enable event bubbling. To cancel across
browsers, the
stopPropagation()
method is supported.
clientX
and
clientY
The cursor's horizontal and vertical position in pixels, relative to the
upper-left corner Web page in which the event occurred. Also good for
the Mozilla/Firefox and W3C event model.
fromElement, toElement
Used to indicate the elements where a mouse is (mouseout and
mouseover) leaving from or moving into. See
relatedTarget
for
W3C/Firefox.
keyCode
The Unicode key code associated with a keypress event. Use
String.fromCharCode(keyCode)
to convert keycode code to a string.
offsetX
and
offsetY
The cursor's horizontal and vertical position in pixels, relative to the
container in which the event occurred, or if outside the container returns
the upper left corner of the document.
returnValue
The return value of the event handler, either
true
or
false
. For
W3C/Firefox use
preventDefault()
method.
srcElement
The element from where the event originated, not necessarily the element
where it was assigned due to bubbling. Use
target
for Firefox.
Continues