JavaScript and Ajax for the Web: Visual QuickStart Guide, Seventh Edition

Making Multiple Links Change a Single Rollover

Up to now, you’ve seen how mousing over a single image (or actually, the link associated with that image) can trigger a rollover effect. But you can also have several different images that trigger a rollover. This can be very useful when you have several images that you want to annotate. Rolling over each of the images makes the description of that image appear. In this example, we’ve done just this with images of three of Leonardo da Vinci’s inventions. As you roll over each image, the description of that image appears in a text box. The description itself is another image. Actually, it’s three images, one for each of the three inventions. Figure 4.8 shows Script 4.8 (HTML) and Script 4.9 (JavaScript) ...