Earlier in this column we explained the interface part. The body of the function is a JavaScript write statement that assembles the DHTML element. First is the STYLE definition. We label the style definition with the imgID appended to a "#" character. The STYLE tag defines the positioning algorithm of the DHTML element (absolute), its position from the left edge of the window (posFromLeft), its position from the top edge of the window (posFromTop), its width (imgWidth), and its z-index (1). More attributes will be added in future versions.

The next line is the opening DIV tag, <DIV ID="', imgID, '">. The only attribute needed here is the DIV tag's ID, set to the first parameter passed to the function. The second line is the A tag definition:

The A tag's HREF attribute points to a JavaScript function called handleImageClick. As explained in a previous page, you have to provide this function in your application. Its parameters are the image's ID, and two parameters, clickParam1 and clickParam2, which were passed from the ancestor makeImage() function.

The IMG tag includes a score of attributes. The most critical ones are the NAME and ID attributes. We assign a single string to both of them. The string is comprised of the DIV tag's ID concatenated with the "img" string. The rest of the parameters are fairly straightforward. They specify the image's URL (imgURL ), its alternative text message (imgAlt ), its border (0 ), its height (imgHeight ), and its width (imgWidth ).

As you can see, these functions accept the element ID and return or set its image's URL. Notice the differences in referencing the DIV tag as well as the IMG tag across platforms. The IMG element is referenced through its NAME attribute, but it is intentionally set equal to the ID attribute. As explained above, the IMG's NAME and ID attributes are equal to the DIV tag's id, concatenated with the "img" string.

Let's summarize this id "business." The DOCJSLIB's makeImage() function expects a DHTML id from its caller (as the first parameter). The caller should use this id in all other references to DOCJSLIB, including the handleImageClick() event handler (its first parameter is the DHTML id). Internally, DOCJSLIB uses this id as the DIV tag's ID and as the basis for the IMG tag's ID and NAME attributes. The "img" string is appended to the DHTML id for the IMG attributes. The following table shows the various attributes and where they are used: