| Dreamweaver Form Rollover buttons
Dreamweaver has always made using roll over buttons in your web pages easy and recent releases even have a library of Flash buttons that you
can use on your site. However, I bet you did not know, that with the addition
of a little snippet of JavaScript, these roll overs and Flash buttons
can be used to brighten up your forms.
ROLL OVERS
For our roll over example we will use the 2 images below for the button.
If you want to use them you can simply right click on them and save them
to your computer.
 
up.gif
over.gif
1/ First we need a simple form. Create a new page and
build a form like the one below.
You will notice that we are sending the form (Action) to a page called
"submit.asp". We will build that page a bit later. All it will
do is display whatever has been entered into the text fields. You can,
of course, send the form contents to wherever you like.
2/ Name the first text field "input1" and
the second text field "input 2".
3/ Now place your cursor below the text fields and click.
Then go click on the "Rollover Image" icon in the Common toolbar.
4/ Browse your way to the first button that you saved,
"up.gif", for the "Original Image. Then to the second button
that you saved, "over.gif" for the "Rollover Image".
Now enter this into the "When Clicked, Go to URL" field
javascript:document.myForm.submit();
Notice the reference to myForm. That is the name that
we gave our form when we built it and you must enter that name into the
JavaScript so that it knows which form you are talking about.
5/ Your form will now look like this.
6/ You have not made the "submit.asp" page
yet so you will probably get an error if you click on your form button
right now. However, this is how it will work once the "submit.asp"
page is built.
| 
