Thank you Ameen, jQuery and its plug-in "blockUI" does this already (other javascript/css libraries do this as well.) But I must confess, not paying attention to their internals had me always wondering on how they did it until you just explained it. Pretty nifty and simple, I might add. Had I had a little more time, I would have figured it out (or so I would like to believe,) but it seems that I can never get any down time at work to do proper research. Thanks again for demistifying
On Thu, May 28, 2009 at 11:52 AM, aboFaisal <ameen.ra...@gmail.com> wrote: > > May be I little far, but check this link: > http://andrislinz.ch/tutorials/modalBox/index.html# > > and click the only existing link in the top left "Open modalBox" > > the box will be shown and click any thing out of the block will be > disabled unless you closed the block by clocking "Close modalBox" > > I mean you can figure out some way to implement the same Idea. That > is, to create one floating div fills out the full page but with > transparent color, keep it for sometime and then remove it. > > basically, you can try this code, hope it works for you: > > <div style="position:fixed; z-index:300; text-align:center; top:0; > left:0; > color:#FF0000; width:100%; padding:200px 0 0" > onclick="alert('you > see, u r able to click onle here');"> > You can Only click here > </div> > > <div style="background:#333366; position:fixed; width:100%; height: > 100%; top:0; left:0; vertical-align:middle; > text-align:center; z-index:200;filter:alpha(opacity=70); -moz- > opacity:0.7; > -khtml-opacity:0.7; opacity:0.7;"> </div> > > I tried it in Chrome, Firefox, Safari, IE8 > it works fine. > > Regards > Ameen >