347
Chapter 12: Adding JavaScript behaviors
You can use the built-in behaviors to enhance the look, functionality, and appeal of your website. You can attach these
behaviors to elements on your web pages without having to know JavaScript.
Using JavaScript behaviors
About JavaScript behaviors
Adobe® Dreamweaver® CS3 behaviors place JavaScript code in documents so that visitors can change a web page in
various ways or initiate certain tasks. A
behavior
is a combination of an event and an action triggered by that event.
In the Behaviors panel, you add a behavior to a page by specifying an action and then specifying the event that
triggers that action.
Note:
Behavior code is client-side JavaScript code; that is, it runs in browsers, not on servers.
Events
are, effectively, messages generated by browsers indicating that a visitor to your page has done something. For
example, when a visitor moves the pointer over a link, the browser generates an
onMouseOver
event for that link; the
browser then checks whether it should call some JavaScript code (specified in the page being viewed) in response.
Different events are defined for different page elements; for example, in most browsers
onMouseOver
and
onClick
are events associated with links, whereas
onLoad
is an event associated with images and with the
body
section of the
document.
An
action
is pre-written JavaScript code for performing a task, such as opening a browser window, showing or hiding
an AP element, playing a sound, or stopping an Adobe Shockwave movie. The actions provided with Dreamweaver
provide maximum cross-browser compatibility.
After you attach a behavior to a page element, the behavior calls the action (JavaScript code) associated with an event
whenever that event occurs for that element. (The events that you can use to trigger a given action vary from browser
to browser.) For example, if you attach the Popup Message action to a link and specify that it will be triggered by the
onMouseOver
event, then your message pops up whenever someone places the pointer over that link.
A single event can trigger several different actions, and you can specify the order in which those actions occur.
Dreamweaver provides about two dozen actions; additional actions can be found on the Exchange website at
www.adobe.com/go/dreamweaver_exchange
as well as on third-party developer sites. You can write your own
actions if you are proficient in JavaScript.
Note:
The terms behavior and action are Dreamweaver terms, not HTML terms. From the browser’s point of view, an
action is just like any other piece of JavaScript code.
Behaviors panel overview
You use the Behaviors panel (Window > Behaviors) to attach behaviors to page elements (more specifically to tags)
and to modify parameters of previously attached behaviors.
Behaviors that have already been attached to the currently selected page element appear in the behavior list (the main
area of the panel), listed alphabetically by event. If several actions are listed for the same event, they will be executed
in the order in which they appear on the list. If no behaviors appear in the behavior list, no behaviors have been
attached to the currently selected element.
September 4, 2007
