HighDots Forums  

Trying for a "modal" layer in MSIE

Cascading Style Sheets Layout/presentation on the WWW (comp.infosystems.www.authoring.stylesheets)


Discuss Trying for a "modal" layer in MSIE in the Cascading Style Sheets forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
javaguy@sbcglobal.net
 
Posts: n/a

Default Trying for a "modal" layer in MSIE - 12-13-2005 , 03:39 PM






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


Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.