Chapter 4: Working with Images

Return to Chapter 4

 

To use this script on your own page, click in the text area below, select all, and copy to grab the script. Then, just paste into your own page — and you're done.

Creating More Effective Rollovers

See it run: Creating More Effective Rollovers

Script 4.2

In this HTML page, there is no JavaScript, only a pointer to an external JavaScript file, which contains the actual rollover code.

Script 4.3

This JavaScript builds better rollovers because it preloads all the images into the browser's cache. By using an external JavaScript instead of putting the rollover code in the HTML page, you don't have to have all that JavaScript in every single page.

Images:

button1_on.gif
button2_on.gif
button1_off.gif
button2_off.gif