HighDots Forums  

div popup - background mask

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


Discuss div popup - background mask in the Cascading Style Sheets forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
matt@mailinator.com
 
Posts: n/a

Default div popup - background mask - 09-11-2006 , 05:24 PM






hello,

i am interested in duplicating a feature ive seen on Netflix -- one by
which a faux-popup (div-based popup) becomes visible, and the
background is masked in a translucent gray.

i am about to start delving into this, but i wanted to see if anyone
had the general technique down already.

....im trying to analyze their site, but its muddy. my guess is its two
w/ two divs -- 1) the mask layer, which is 100% WxH, w/ the semi-opaque
gray. 2) the "popup" div, which is z-indexed on top of #1, w/ no mask.


thanks!
matt


Reply With Quote
  #2  
Old   
matt@mailinator.com
 
Posts: n/a

Default Re: div popup - background mask - 09-12-2006 , 03:09 PM






i did this. my approach was to have two divs:

1) the background mask, height & width set to 10)%. background-color of
black and using an IE filter to reduce its opacity to 15% (my app is
IE-only intranet)

2) the popup/dialog window, centered, which looks like a post-it note
w/ a slight fuzzy dropshadow. it has a higher z-index than the mask
div, so it is 100% opacity, which makes it the central focal point.

the dialog div also has an "X" in its top-right corner, for closing the
dialog and canceling the mask layer.

presto.


matt


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 - 2009, Jelsoft Enterprises Ltd.