Java Reference
In-Depth Information
In order for this to work properly, the parameter your event handling function accepts needs to be
called event. That way, IE's window.event object is referenced when you call the element() method
as well as the event object passed to the function by W3C DOM browsers.
Rewriting the DHTML Toolbar with Prototype
You now know how to retrieve elements, change an element's style, add and remove elements from
the DOM, and wire up events, and get the element that fi red the event with Prototype. Let's apply that
knowledge and rewrite the DHML toolbar.
Try It Out Revisiting the Toolbar with Prototype
Open your text editor and type the following:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<title>Chapter 15: Example 5 with Prototype</title>
<style type=”text/css”>
.tabStrip
{
background-color: #E4E2D5;
padding: 3px;
height: 22px;
}
.tabStrip-tab
{
float: left;
font: 14px arial;
cursor: pointer;
padding: 2px;
border: 1px solid transparent;
}
.tabStrip-tab-hover
{
border-color: #316AC5;
background-color: #C1D2EE;
}
.tabStrip-tab-click
{
border-color: #facc5a;
background-color: #f9e391;
}
</style>
<script type=”text/javascript” src=”prototype-1.6.0.3.js”></script>
<script type=”text/javascript”>
var currentNum = 0;
