Java Reference
In-Depth Information
you click your mouse, an alert box tells you the coordinates of where your mouse pointer was when
you clicked.
Once again, the majority of code is left untouched with only five lines of code having changes. First,
you want to include the eve nt‐utility.js file using a <script/> element:
<script src="event-utility.js"></script>
Next, you register the mouseover , mouseout , and click event listeners using your evt.addListener()
method:
evt.addListener(document, "mouseover", handleEvent);
evt.addListener(document, "mouseout", handleEvent);
evt.addListener(document, "click", handleEvent);
And finally, you change the first line of the handleEvent() function:
function handleEvent(e) {
var target = evt.getTarget(e);
Instead of using any browser‐specific code, you use evt.getTarget() to retrieve the element object that
received the event.
Now let's look at ch10_example13.html and use the evt object.
a Crude tab Strip for all Browsers
trY it out
In this Try It Out, you will rewrite ch10_example13.html using your cross‐browser event utility.
Open your text editor and type the following, or you can copy ch10_example13.html and change the
highlighted lines of code:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Chapter 10: Example 17</title>
<style>
.tabStrip {
background-color: #E4E2D5;
padding: 3px;
height: 22px;
}
.tabStrip div {
float: left;
font: 14px arial;
cursor: pointer;
}
.tabStrip-tab {
padding: 3px;
 
Search WWH ::




Custom Search