This package (version 2.0, requires Pro version 2.44+) consists of a set of beautiful and professionally drawn overlay images and close icons. These images are very high quality, many with graded transparency and 3-D effects. Below are some samples of both the overlay and close images, with the templates for the overlay images shown in the application preview window.

The package currently consists of 50 overlay images and 27 close images each in 3 different sizes (12x12px, 15x15px, 20x20px) plus another 10 large close icons at 20x100px making a total of 91 close images.

The 20x20px size can be swapped in to replace our default red icon, and all the images can be used in the content or page (further enhancements coming with free upgrade to those who purchase now):

  What is an overlay image

An overlay image covers the popup completely so that the image itself appears as the popup. See this example. Some of the images are standard gifs and some are partially transparent png images, such as the notebook shown below.

The package consists of images and templates, so that you can very easily load them into the application and modify at will.

  About the close icons

Many people prefer to substitute a different image than the default red close icon that comes with the application, and there are already a few alternative images included free at installation time.

These images may (in the case of the 20x20px size) be used in the title bar, or they may be used in the content or page as desired. See this example.

  Instructions

After purchase, download the package, which is a zipped file. Extract all contents (keeping the file structure as it is) to a folder of your choice. This folder could be the templates folder of Advanced DHTML Popup, but it does not have to be.

Open Advanced DHTML Popup and navigate to the overlays folder, where you will see all the templates for the package (*.dpu).

The close icons are to be found in the adjacent folder and its sub-folders, organized by size. Any of these may be used in the content instead of having the default close icon in the title bar. See the application template "Close button position examples" for the correct way to do this. The template also gives nice HTML examples for the various positions showed.

To use the default title bar location but with a different image, choose one of the 20x20 close icons and copy this into your project folder. You must rename it to "close.gif" for this to be picked up correctly by the application.

Some of the beautiful overlay image templates (shown in the preview window) Note that the images all come blank, the text shown is done in the application. Any text/html/additional images etc may be placed on top of the images in the usual way. (Scroll down to see the close icons)
Some of the 20x20px & 20x100px close button images