var hideOnOverlayClose = new Array();

function getOverlay() {
  var overlay = document.getElementById('overlay');
  
  if (!overlay) {
    overlay = document.createElement('div');
    overlay.id = 'overlay';
    overlay.style.display = 'none';
    
    overlay.hide = function() {
      // show select lists again
      var selectLists = document.getElementsByTagName('select');
      for (var i=0;i<selectLists.length;i++) {
        selectLists[i].style.visibility = 'visible';
      }

      this.style.display = 'none';
      this.style.zIndex = '-1';

      for (i = 0; i < hideOnOverlayClose.length; i++) {
        hideOnOverlayClose[i].hide();
      }
    }
    overlay.show = function() {
      // IE6 shows select lists on top of everything else, regardless of z-index, so we'll hide them for a while
      var selectLists = document.getElementsByTagName('select');
      for (var i=0;i<selectLists.length;i++) {
        selectLists[i].style.visibility = 'hidden';
      }

      this.style.display = 'block';
      this.style.zIndex = '10000';
    }
    
    overlay.onclick = function() {
      this.hide();
    }
    
    document.body.appendChild(overlay);
  }
  
  return overlay;
};