1. This tutorial is NOT going to teach you how to design your button, we are going to assume that you already have your button ready, you will need an image of the original button and an image of how its going to look on a rollover, I have done my buttons in Photoshop.
2. Now open up Dreamweaver and start a new page, I'm going to start an HTML page.
Click to enlarge
3. Next, go to Insert > Image Objects > Rollover Image.
4. Now a window will come up, follow these instructions for what to fill in:
Image Name: (Type in the button name)
Original Image: Browse/Open your Original Button Image here
Rollover Image: Browse/Open your rollover Button Image here
Check Preload RollOver Image
Alternate Text: (Text that will show when mouse over)
URL: (Type the link of where the button will go to)
I did this like the following screen shot:
Click to enlarge
5. Now your button will be on your canvas.
6. Now lets preview it on our browser, I'm going to preview it on Fire Fox, though you can preview it on Internet Explorer or whatever your default browser is.
This concludes our tutorial, you should have something like this:
