Dynamic HTML Example : Template Images

When a Dynamic Overlay site is created, many images are present that are not initially needed by the user. These are placed in hidden overlays for display upon user action. Because these images are not immediately needed, they can be first created from a single template.

A template Image is a very small image file (35 bytes) that is initially placed in the web page to 'reserve' a location, size, and identity for an image that will be used after the page is loaded. This small template file copies extremely fast and will not appreciable add loading time because it is only loaded once, yet copied to many locations.

Only after the body is loaded, are these templates filled by the actual image file. The user is then free to navigate the overlay site at any time after the body is loaded, even during the template replacement period. The developer will choose which images will be needed immediately, with all others being templates.

Each template image is to have a unique name and its size. Create a variable name and assign it an Image() object. After the body loads, the fillTemplate function is fired and then replaces each template with its assigned image within its specified DIV.

turkey
shark
crab
spider
worm