DOM created image expected position shifts

On window load I'm running some javascript to add an image to a DIV. The
image is being added/created but it is about 18 or so pixels further
down the screen than expected. If I code the IMG tag, including a style
attribute, directly into the DIV's HTML the image displays where I
expect it to i.e. in the top left corner.

Is there something about DOM methods that affects positioning or is
there something else I've missed?


The relevant js looks like this:

if (document.getElementById("up")) {
myimg = document.createElement("IMG");
} else {
return;
}
document.getElementById("up").appendChild(myimg);
myimg.src = "q.png";
myimg.style.position = "absolute";


The relevant HTML is simply this:

<div id="up" style="position:absolute; left:40px; top:40px; width:600px;
height:80px;>
</div>


Andrew Poulos

re: DOM created image expected position shifts

Your code works just fine for me under IE 6.0 and Firefox 1.0.4 (which
is your browser? I guess by posting props). There must be someting else
in the outer code.

re: DOM created image expected position shifts

Andrew Poulos wrote:
[color=blue]
> On window load I'm running some javascript to add an image to a DIV. The
> image is being added/created but it is about 18 or so pixels further
> down the screen than expected. If I code the IMG tag, including a style
> attribute, directly into the DIV's HTML the image displays where I
> expect it to i.e. in the top left corner.
>
> Is there something about DOM methods that affects positioning or is
> there something else I've missed?[/color]

Perhpaps there are other child nodes already in the <div> so that you
should better use
divElement.insertBefore(myimg, divElement.firstChild);
if you want to make sure the image sits as the first element.
If you don't specify left/top on the absolutely positioned <img> then it
takes its place in the normal flow thus if there are any child nodes
before it it can end up below the top left corner.


--

Martin Honnen
http://JavaScript.FAQTs.com/