Displaying text over image in IE

[Norm]

Hi,
I'm trying to create an HTML page that displays an image and will display a small text at the location the mouse is clicked. I've gotten it to work with Firefox but am unable to get it to work with IE.

After I determine the text I want to display (its in NamesList[]) at the clicked location I use the following Javascript code:

   	  var aDiv = document.createElement('div');
        aDiv.setAttribute("id", LayerNm + divCnt++);
        // Display the name at the upper left of rectangle given in NamesList[]
        var absPt = relToAbs(NamesList[ix+dX], NamesList[ix+dY]);  // get absolute point location
        aDiv.setAttribute("style", 'position:absolute;left:' + absPt.x + 'px;top:' 
                                    + absPt.y + 'px;font-weight:bold;color:cyan');
        aDiv.appendChild(document.createTextNode(NamesList[ix+dName]));	
   	  aDiv.onmousedown = myMouseDown;  // set for new div
   
        imgDiv.parentNode.insertBefore(aDiv, imgDiv);  // works!!!

Definitions from other parts of code:

         imgDiv = document.getElementById('Image');  // set global one time here
   ...
<CENTER><IMG SRC="1990_Reunion-300_ED1.jpg" HEIGHT="96%" ALT="1990 Reunion" id="Image"></CENTER>
   ...

Works in Firefox, but not in IE.
Is there code that will work in both browsers?
Is there code that will work in IE that I can use if in IE?

Thanks,
Norm

[Xeel]

If you understand what you are doing:

To make a child element's absolute position be relative to a parent element you have to declare this parent's style as "position:relative". Otherwise the child element will take a lower level parent with this property declared, down to the document window itself if no parent has it's position set "relative".

Also I would strongly recommend playing with position style property for DIV elements only, other elements have problems with it.

So instead of calculating absolute paths from the document widow or anywhere else you could:

1. Enclose image in a div (later "parent div") with position property set to relative.
2. Inside the parent div somewhere after the image tag enclose in a div the element you want to be over the image setting its position to absolute and its left and top properties to some fixed values which will be the same for all images if there is more.