Step One: Create Two Images
As with regular button rollovers, you use two images to show the "off" and "on" states of the graphic. However, because we are using image maps instead of separate graphics, you'll only need a total of two images versus two for every button. In our example, there are three buttons "carved" from one graphic, but there very easily could have been eight or a dozen separate buttons which would have required 16 or 24 separate images -- again, as opposed to our two.
After building your first image, bring it into your favorite image processing program and make the alterations necessary to create your second image. All I did to make my "on" image was to add a glow effect to each of the three hotspots.
Tip
One of the methods used in
this technique involves clipping a region of an image. Presently, layers
only support rectangular clipping. Keep this in mind as you build your primary
image and avoid placing your hotspots too close together.
Next -->
|
Step Three: Attach the Behavior |