[Chapter 16] 16.6 Other Image Techniques

16.6 Other Image Techniques

There are some other techniques for programming with images besides those that use the Image object discussed here. We saw one, the dynamic generation of XBM images, in Chapter 14, Documents and Their Contents. There is another technique that can be useful when dynamically generating documents (in another window or frame) that contain images. Bear in mind that if the image you supply does not match the WIDTH and HEIGHT specified in the <IMG> tag, the browser will stretch the image as necessary. This can be useful, for example if you want to use an image as a graphical horizontal rule: you can supply an image that is only one pixel wide (that will thus load quickly), and rely on the browser to stretch it horizontally for you to any desired length.

Similarly, when you want to include rectangles of a solid color in a document, you can use an image that is just one pixel by one pixel in size, and stretch it to any desired dimensions. This technique can be used, for example, to dynamically generate bar charts and histograms in documents by using JavaScript to dynamically generate IMG tags that stretch a given image to the appropriate sizes.

You can play a related trick (that does not involve JavaScript) with the background image for a document (specified by the BACKGROUND attribute of the <BODY> tag). The browser uses this image as a tile to fill the entire background. Suppose you want your documents to have a vertical bar or border along their left edge. If you create a narrow borderless vertical frame in the window, then you can specify a background image that has the desired width and is only a few pixels tall. The browser will fill the frame with repeating copies of this image, which will produce the vertical bar you're looking for.


Image Replacement Example		Forms and Form Elements