Dreamweaver Tutorial

Add some alternative text, we’ll be using –‘screen readers’ and I can choose to whether I want to go and put a file name to the link here. So I can either go and put your link to connect to an external website or I could browse for any other pages that I have on my site.

If you don’t have files prepared already it doesn’t matter you can go and add these later on. You might have noticed we have a tick here- on the ‘preload rollover image’ and that just makes sure that the rollover image though not initially displayed on the page, downloads as the page downloads as well, so when the user takes the cursor over the top it’s there ready and waiting to get a quick transition and give us that roll over effect that we’re after.

So I click ‘ok’ then and there’s the button place into the page. We again preview that in ‘Safari’ and save the changes as I do that and here’s my button added into Safari. I’ll take my cursor over the top and see that it’s rolling over nicely. Let’s go and do that again. So the process was ‘Insert’- ‘Image Objects’- ‘Image Place holder’, sorry – ‘Rollover Image’. Name it; find your buttons- add text for screen readers. If you have it ready you can make a link here or we can do that later.

And I’m gonna ‘ok’ that. Quick glance through Safari. And that’s how you insert a JavaScript rollover into Dreamweaver. It should be added here that there are other ways in achieving that rollover effect most notably with Scholar sheets and there are arguments for using CSS to go and do that rather than using JavaScript.

Research and make your choices.

In case you didn’t see the video in part 1 of this series… here it is again.

Tags

Dreamweaver Tutorials