The Cross Browser DHTML Shim

browser wars 1998 still works

The three way branch that sat at the top of every DHTML script for four years.

In 2026: The getElementById branch is the only one that runs now, and it is the only one you need. Netscape 4 used document.layers with its own coordinate properties, IE4 used document.all, and the two disagreed about almost everything.

Where it came from: The standard opening of DHTML scripts on Dynamic Drive and Webmonkey, roughly 1998 to 2002. MDN ↗

<div id="box" style="position:absolute; left:20px; top:60px; width:160px;
     background:#FFFFCC; border:1px solid #999">Move me.</div>

<script language="JavaScript">
// 1998, in full
var isNS4 = (document.layers) ? true : false;
var isIE4 = (document.all && !document.getElementById) ? true : false;
var isDOM = (document.getElementById) ? true : false;

function getObj(id) {
  if (isDOM) return document.getElementById(id).style;
  if (isIE4) return document.all[id].style;
  if (isNS4) return document.layers[id];       // note: not .style
  return null;
}
function moveTo(id, x, y) {
  var o = getObj(id);
  if (!o) return;
  if (isNS4) { o.left = x; o.top = y; }        // numbers
  else       { o.left = x + "px"; o.top = y + "px"; }   // strings with units
}

var n = 0;
setInterval(function () { n = (n + 4) % 160; moveTo("box", 20 + n, 60); }, 60);
</script>

sandboxed demo · breaks nothing but itselfrestart

More in browser wars