2.8. Exporting Image Maps (HTML Images with Clickable Regions)

Problem

You want to export an image and an HTML page in which the HTML page contains an image map that allows the user to click on various portions of the image.

Solution

Change the publish settings so that Flash will export a single-frame image and an HTML page using the image map template. Then publish.

Discussion

Flash can export not only single-frame images and HTML pages, but also simple button functionality as an image map. An image map in HTML is a way of defining rectangular regions over an image that are clickable. A classic example is a map in which different regions can be clicked to hyperlink to another page with details about the region. Flash provides you with a simple and convenient way to create such image maps with built-in templates.

First of all, let’s consider the simplest example, in which your Flash document has a single frame. On that one frame, you have artwork that you’d like to export as a single-frame image. For example, perhaps you have artwork for a world map, as shown in Figure 2-3.

Artwork to export as a single-frame image

Figure 2-3. Artwork to export as a single-frame image

However, you also want to export an HTML page that will contain clickable regions over the map. The following steps outline the basic procedure:

  1. Create a button symbol. In the button symbol, draw a filled rectangle on the Hit frame. This step will create an invisible ...

Get Flash 8 Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.