Positioning DIV Layers

Question: How do I re-position a DIV layer on my page using JavaScript?

Answer: To re-position a DIV layer

myLayerID
, in Internet Explorer you need to set
myLayerID.style.posLeft
and
myLayerID.style.posTop
to the integer coordinates of the desired position of the layer's top left corner. In most other browsers, the style properties
posLeft
and
posTop
are not supported. Instead, in non-IE browsers you would need to set
myLayerID.style.left
and
myLayerID.style.top
to the desired coordinates in the format
Xpx
and
Ypx
, respectively. Note that here you must specify the units (px) after the coordinate values.

Here's an example that works in most modern browsers by combining both of the above techniques:

This example uses the function

setPostion
. Below is the JavaScript source code of this function:
function setPosition (id,leftX,topY) {
 var layerRef = document.getElementById(id);

 if (layerRef==null) return;

 if (null!=layerRef.style.left) {
   layerRef.style.left = leftX+'px';
   layerRef.style.top  = topY+'px';
 }
 if (null!=layerRef.style.posLeft) {
   layerRef.style.posLeft = leftX;
   layerRef.style.posTop  = topY;
 }
}
See also:

Copyright © 1996-2018, JavascriptFAQ.net.