I'm working with code from the book "Ajax in Action" (by Dave Crane,
Manning Press).  The chapter 6 code has a "notifier" object.  It will
show a dialog box with messages in it by attaching a
DIV-TABLE-TBODY-TR-TD construct with document.body.appendChild().  It
shows a modal dialog box by attaching a full-screen div with
document.body.appendChild() and then attaching the
DIV-TABLE-TBODY-TR-TD construct to that full-screen div.  A snippet
follows:

msg.createDialog=function(id,bar,isModal){
var dialog=document.createElement("div");
dialog.className="dialog";
dialog.id=id;
var tbl=document.createElement("table");
dialog.appendChild(tbl);
dialog.tbod=document.createElement("tbody");
tbl.appendChild(dialog.tbod);

..

if (isModal){
dialog.modalLayer=document.createElement("div");
dialog.modalLayer.id="modallayer";
dialog.modalLayer.className="modal";
dialog.modalLayer.appendChild(dialog);
document.body.appendChild(dialog.modalLayer);
}else{
dialog.className+=" non-modal";
document.body.appendChild(dialog);
}

..

}

The CSS class "modal" is:

.modal{
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
background-image:url(img/modal_overlay.gif);
}

In Mozilla (Mozilla FireFox) this works very well.  When a modal dialog
the entire browser space is covered by the background image, except for
where the foreground dialog is.  Rollovers and clicks on objects other
than the dialog are ignored.

In MSIE the dialog appears and accepts clicks, the background image
doesn't display and clicks and mouseovers are accepted outside of the
dialog.  In short, non-modal.

Is there some trick to making this work in MSIE?  I've been using MSIE
6.0.

Thanks,

Jerome Mrozak