Click to return to the Microsoft FrontPage home page    
Image Maps, Part 2    
Web Workshop  |  Languages & Development Tools  |  Microsoft FrontPage

Creating Image Maps (cont.)


Brought to you by Inside Microsoft FrontPage, a ZD Journals publication. Click here for a free issue.

Testing your hotspots

Now that we've created some hotspots, let's test them. Click on the Preview in Browser button (<ICON>) to switch to Internet Explorer. You'll be prompted to save the fishbowl image and the page first.

When the browser opens, move the cursor over your image. As Figure E shows, the target URL of each hotspot will appear in the status bar. (Note: unless you've actually created the target pages, don't click a hotspot. Doing so will give you an error.)

screen shot

Figure E. As the status bar and the cursor indicate, the globe hotspot is active

Modifying hotspots

While testing your hotspots, you may find that you need to make some changes -- for example, entering a new URL, or deleting a hotspot altogether. Fortunately, FrontPage makes these tasks easy.

To edit your image map, simply switch back to FrontPage Editor and click on the image. When you do, all the hotspots will be outlined. Just as you did before, you can drag or resize a hotspot as needed. To change the target URL, just double-click on the link.

To delete a hotspot, merely hit the Delete key. Be careful not to hit Delete twice, however; doing so will delete your image.

If you have a lot of hotspots -- or if they all align closely with parts of the image -- you may have a hard time spotting them. That's where the Highlight Hotspots button (<ICON>) comes in. Clicking on this button makes the image itself temporarily vanish so you can easily see the hotspots, as Figure F shows.

screen shot

Figure F. The Highlight Hotspots button lets you see the hotspots by themselves

Notes

The hotspots we've created in our example have all been in separate parts of the image. However, you can overlap hotspots. When you do, those "on top" take precedence over those below.

Your ISP will need to have the FrontPage Server Extensions installed for FrontPage image maps to work. If the extensions aren't installed, switch to FrontPage Explorer and choose Web Settings . . . from the Tools menu. Click the Advanced tab, then choose Netscape from the Style dropdown list, as shown in Figure G.

screen shot

Figure G. If your ISP doesn't have the FrontPage extensions installed, change to Netscape-style image maps

That setting should work with most servers. The NCSA and CERN styles are also available; talk to your ISP about which one would be appropriate.

Conclusion

Image maps are powerful HTML features. They give you unlimited control over the size, shape, and position of hotspots on an image. Thanks to FrontPage, you can easily create image maps, as we've shown you in this article.



Back to topBack to top

Did you find this material useful? Gripes? Compliments? Suggestions for other articles? Write us!

© 1999 Microsoft Corporation. All rights reserved. Terms of use.