X Functions

The code sample is a part of X, a Cross-Browser Javascript Library, Distributed under the terms of the GNU LGPL.

These specific functions help get multi-column layouts to have the same column height for all columns.

// xAddEventListener, Copyright 2001-2007 Michael Foster (Cross-Browser.com)

function xAddEventListener(e,eT,eL,cap)
{
  if(!(e=xGetElementById(e)))return;
  eT=eT.toLowerCase();
  if(e.addEventListener)e.addEventListener(eT,eL,cap||false);
  else if(e.attachEvent)e.attachEvent('on'+eT,eL);
  else e['on'+eT]=eL;
}



// xHeight, Copyright 2001-2007 Michael Foster (Cross-Browser.com)

function xHeight(e,h)
{
  if(!(e=xGetElementById(e))) return 0;
  if (xNum(h)) {
    if (h<0) h = 0;
    else h=Math.round(h);
  }
  else h=-1;
  var css=xDef(e.style);
  if (e == document || e.tagName.toLowerCase() == 'html' || e.tagName.toLowerCase() == 'body') {
    h = xClientHeight();
  }
  else if(css && xDef(e.offsetHeight) && xStr(e.style.height)) {
    if(h>=0) {
      var pt=0,pb=0,bt=0,bb=0;
      if (document.compatMode=='CSS1Compat') {
        var gcs = xGetComputedStyle;
        pt=gcs(e,'padding-top',1);
        if (pt !== null) {
          pb=gcs(e,'padding-bottom',1);
          bt=gcs(e,'border-top-width',1);
          bb=gcs(e,'border-bottom-width',1);
        }
        // Should we try this as a last resort?
        // At this point getComputedStyle and currentStyle do not exist.
        else if(xDef(e.offsetHeight,e.style.height)){
          e.style.height=h+'px';
          pt=e.offsetHeight-h;
        }
      }
      h-=(pt+pb+bt+bb);
      if(isNaN(h)||h<0) return;
      else e.style.height=h+'px';
    }
    h=e.offsetHeight;
  }
  else if(css && xDef(e.style.pixelHeight)) {
    if(h>=0) e.style.pixelHeight=h;
    h=e.style.pixelHeight;
  }
  return h;
}



// xGetElementById, Copyright 2001-2007 Michael Foster (Cross-Browser.com)

function xGetElementById(e)
{
  if(typeof(e)=='string') {
    if(document.getElementById) e=document.getElementById(e);
    else if(document.all) e=document.all[e];
    else e=null;
  }
  return e;
}


// xNum, Copyright 2001-2007 Michael Foster (Cross-Browser.com)

function xNum()
{
  for(var i=0; i<arguments.length; ++i){
	if(isNaN(arguments[i]) || typeof(arguments[i])!='number') return false;
	}
  return true;
}



// xDef, Copyright 2001-2007 Michael Foster (Cross-Browser.com)

function xDef()
{
  for(var i=0; i<arguments.length; ++i){if(typeof(arguments[i])=='undefined') return false;}
  return true;
}


// xStr, Copyright 2001-2007 Michael Foster (Cross-Browser.com)

function xStr(s)
{
  for(var i=0; i<arguments.length; ++i){if(typeof(arguments[i])!='string') return false;}
  return true;
}


// xGetComputedStyle, Copyright 2002-2007 Michael Foster (Cross-Browser.com)

function xGetComputedStyle(oEle, sProp, bInt)
{
  var s, p = 'undefined';
  var dv = document.defaultView;
  if(dv && dv.getComputedStyle){
    s = dv.getComputedStyle(oEle,'');
    if (s) p = s.getPropertyValue(sProp);
  }
  else if(oEle.currentStyle) {
    // convert css property name to object property name for IE
    var i, c, a = sProp.split('-');
    sProp = a[0];
    for (i=1; i<a.length; ++i) {
      c = a[i].charAt(0);
      sProp += a[i].replace(c, c.toUpperCase());
    }
    p = oEle.currentStyle[sProp];
  }
  else return null;
  return bInt ? (parseInt(p) || 0) : p;
}


// END X FUNCTIONS


function adjustLayout()
{
  // Get natural heights
  var lHeight = xHeight("left");
  var mHeight = xHeight("center");
  var rHeight = xHeight("right");


  // Find the maximum height
  var maxHeight = Math.max(rHeight,Math.max(lHeight, mHeight));

  // Assign maximum height to all columns
  	xHeight("left", maxHeight);
  	xHeight("center", maxHeight);
  	xHeight("right", maxHeight + 75);


  // window.alert(maxHeight);
  //  window.alert(document.getElementById("left").style.height)
}


window.onload = function()
{
  xAddEventListener(window, "resize",adjustLayout, false);
  adjustLayout();
}