Dreamweaver offers several built-in JavaScript functions called "Behaviors."
These behaviors are found in the Behaviors tab of the Design panel (Window >
Behaviors). There are several behaviors that come with Dreamweaver, and several
more that can be added as "Extensions" or plugins from www.macromedia.com/downloads.
Before you can get any extensions, you need to install
the extension manager found at: http://www.macromedia.com/exchange/em_download/ |
JavaScript enables web pages to have a certain degree of interactivity. For instance, a little JavaScript in a web page can let the user know if a certain form field has been filled out correctly. Other scripts can display an alert message, open a new window, perform calculations, and a huge variety of other functions. One behavior that we will use is the "Validate Form" behavior.
Read the following supplemental tutorial to get a feel for what Dreamweaver Behaviors can do. The behavior you will apply in your page is NOT covered in the tutorial, but don't panic, we'll walk you through it.
If you need more information than these tutorials cover, refer to the Dreamweaver manual (the book or in the Help menu within Dreamweaver) or search the Internet for "Dreamweaver Tutorial."
Activity: |
Validate the input on your contact page email form. Using JavaScript, you can verify that a user has put the correct type or amount of information in a form before they submit it.
|
Dreamweaver MX makes it easy to apply JavaScript rollovers to images. This means that when you move your mouse over an image, such as a button, it will replace the current image with another one, such as a highlighted version of the same button. In Dreamweaver, this is called the "Swap Image" behavior
The following supplemental 1 page tutorial and the activity below will guide you through the simple process of creating a rollover. Both assume that you have at least 2 images prepared. We suggest creating a simple button in a graphics program that says "Home" and making a copy of it that is a slightly different color, naming them "home_up.gif" and "home_over.gif" respectively. Otherwise, find 2 images that you would like to apply the Swap Image behavior to.
Activity: |
Add a Rollover button to your web site.
|