Sign Up Now
Twitter Facebook Flickr Buzz
Social Networks


Forgot Password? Go Join Now
Sign Up for Starter's Pack (Free)
Call (800) 223-8720
Need Web Solutions? Get Free Sample Issue

Library: Creative Design


Take advantage of page layers to provide pop-up info for web viewers

Added on Wednesday 4th of February 2009 09:23 am EST

Application > Adobe GoLive CS/CS2
Operating Systems > Macintosh, Microsoft Windows

When you think of using layers on web pages, you usually think of interactive actions, such as fl youts, dropdowns, and DHTML animations. However, you can also use layers for a variety of other useful functions, including the pop-up shown in FIGURE A, to enable you to provide the viewer with helpful information such as descriptions, captions, hints, and images. These are especially useful when the page layout doesn't allow for such additional text or images. The process is quick and clean, but requires some fi nesse, so let's get started on an example so you can start using this technique on your website today.

Create a new page and add a table
For our example, let's set up a web gallery of thumbnails that are linked to images that the viewer can download. To follow along using our example, download the LAYERS.ZIP fi le from the URL address located at the beginning of this article:
1. Open a new blank HTML page in GoLive. Save the page as Web Gallery.
2. Toggle the Head Section button open, and then select the Title button icon .
3. Choose the Page tab in the Inspector palette, and then enter Web Gallery in the Title text box.
4. Select the Color check box in the Background panel and double-click on the color swatch to the right of the text box to display the Color tab.
5. Enter 237, 237, and 214 in the R:, G:, and B: text boxes, respectively; click OK to add a color to the page background, as shown in FIGURE B. You're now ready to add the thumbnail gallery images.

Create a table and place the images ...