HTML 4.0 Sourcebook
(Publisher: John Wiley & Sons, Inc.)
Author(s): Ian S. Graham
ISBN: 0471257249
Publication Date: 04/01/98

Figure 6.46  Display, by the Internet Explorer 3 browser, of the document shown in Figure 6.45.

</A>

where imagemap is a server-side gateway program that can interpret the map coordinates. When the user clicks on the image, the browser uses the HTTP GET method to access the URL, indicated by the anchor element, and appends the coordinates of the mouse click (relative to the upper left-hand corner of the image) to the accessed URL. The details of this procedure were discussed in Chapter 3.

LONGDESC=“url” (optional; not currently supported) Specifies a URL that contains a long text description of the image. This is not supported by current browsers.

LOOP=“number,” “infinite” (optional; Internet Explorer only) Specifies how many times the video clip should be looped before stopping. LOOP=“-1” or LOOP=“infinite” means that the loop will play indefinitely. The default value is 1. The use of IMG for video display should be avoided, in favor of using OBJECT.

LOOPDELAY=“number” (optional; Internet Explorer only) Specifies the delay, in milliseconds, between subsequent replays of the video clip. The default value is 0. The use of IMG for video display should be avoided, in favor of using OBJECT.

LOWSRC=“url” (optional) Specifies the URL of an image file to be loaded and displayed prior to loading and displaying the image indicated by the SRC attribute. LOWSRC usually references a placeholder image that can be loaded and displayed more rapidly than the full-resolution version (specified by SRC).

NAME=“string” (optional) Specifies a name identifier for the image element. The image element is then accessible, via this name, to a JavaScript program. JavaScript (as of Netscape Navigator 3) can then modify the content of the IMG element, for example to change the image element content when the mouse pointer passes over the image.

OnAbort=“string” (optional) Specifies the JavaScript event handler to run if the user aborts the loading of the image file, for example, by pressing “Stop” before the image has arrived. The value string is script program code to run if the onAbort event occurs. See also Chapter 7.

OnError=“string” (optional) Specifies the JavaScript event handler to run if an error occurs while loading the image file, for example, if the image file is corrupted. The value string is script program code to run if the onError event occurs. See also Chapter 7.

onLoad=“string” (optional) Specifies the JavaScript event handler to run upon successfully loading the image file. The value string is script program code to run if the onLoad event occurs. See also Chapter 7.

SUPPRESS=“0,” “1” (optional; Netscape Navigator 4 only) Suppresses the display of the placeholder image icon that appears prior to image loading. The possible values are “1” (true) and “0” (false). If true (“1”), then the placeholder image is not displayed. If false (“0”), then the placeholder is displayed. The default value is “0.”

SRC=“url” (mandatory) Specifies the URL of the image file to be included inline.

START=“fileopen,” “mouseover” (optional; Internet Explorer only) Indicates when a video clip should begin playing: START=“fileopen” implies the movie starts as soon as the video file is downloaded, while START=“mouseover” implies that the movie should start playing when the mouse pointer is moved over the viewing window. Both can be specified, separated by commas. For example, START=“fileopen,mouseover” will invoke both behaviors. Note that, in general, the use of IMG for video display should be avoided, in favor of using OBJECT.

USEMAP=“url” (optional) Specifies a URL pointing to a client-side imagemap MAP element. A document can contain, within a MAP element, imagemap coordinate data. This lets a browser itself determine which link to access when a user clicks the mouse over an active image, as opposed to the traditional (ISMAP) method of sending the click coordinates to a server gateway program for subsequent processing. An IMG element references a MAP element via the USEMAP attribute, which takes, as its value, either a fragment identifier (the MAP is in the same file as the IMG element) or a full URL plus a fragment identifier (the MAP is in a separate document). Each MAP element must consequently be identified by an appropriate NAME attribute value.

A developer can specify both USEMAP and ISMAP in the same IMG element, with USEMAP having precedence. Thus, if a browser understands USEMAP, it will use the local MAP, while if the browser does not understand USEMAP, it will access the standard server-side imagemap program referenced by the surrounding hypertext anchor. For example:

<A HREF="/cgi-bin/imagmep/mapfile1"><IMG SRC="image.gif"
	 USEMAP="#map1"  ISMAP></A>
...
<MAP NAME="map1">
<AREA SHAPE="rect" COORD="10,20,50,50" HREF="stuff.html">
<AREA SHAPE="rect" COORD="30,40,60,60" HREF="otherstuff.html">
...
</MAP>

If the browser interpreting this document understands USEMAP, it will use the local map <MAP NAME="map1"> when the user clicks on the active image. If the browser does not understand USEMAP, it will revert to ISMAP and will send the click coordinates to the referenced server-side program, as per standard practice.

VSPACE=“number” (optional) Specifies, in pixels, the vertical space to be left between a floated image and the surrounding text (above or below). The use of this attribute is illustrated in Figures 6.45 and 6.46. Note that this extra space is applied both above and below the image. Finer control of spacing is provided by the style sheet padding property. Indeed, HTML 4 recommends dropping the VSPACE attribute in favor of using style sheet properties to control spacing and image positioning.

WIDTH=“number,” “real%” (optional) Specifies the width of the image to be displayed—a browser will scale the image to fit this width if the image is actually a different size. Percentage widths are calculated relative to the available space: Thus if the image is inside a table cell, this should be a percentage of the table cell’s width. Unfortunately, when percentage widths are used on an IMG element, Netscape Navigator 3/4 and Internet Explorer 4 improperly render the element when it is placed inside a table cell. Thus, percentage widths should be avoided on IMG elements used within table cells.

If only one of HEIGHT or WIDTH is specified, then the entire image will be resized, with the aspect ratio (ratio of height to width) kept constant—thus the image is not distorted. However, an author can use specific HEIGHT and WIDTH values to stretch and distort an image to any desired size. This is commonly used, with a transparent 1 pixel by 1 pixel image, to create fixed-width tables.

Most importantly, specified HEIGHT and WIDTH values let a browser format the text before actually loading the image, since it already knows the size that the image requires.

The use of WIDTH is illustrated in Figures 6.45 and 6.46.