I like the look of the link dialog here. It darkens the screen and is probably modal (although I haven't tested that I just assume it is). What's a quick and easy way of darkening the screen like that witha jQuery UI Dialog?
+8
A:
The functionality you're talking about is provided by the WYSIWYM Markdown Editor
To do it with jQuery UI's dialog, try this:
$("#something").dialog({ modal: true; });
<div id="something" title="modal dialog">
<p>Add your stuff here.</p>
</div>
It's not exactly the same by default, but I think it's even prettier. ;)
Stuart Branham
2009-02-11 00:46:32
+1 for modal: true.
Wayne Khan
2009-02-11 03:39:00
+2
A:
One way to do it is to have a div at z-order > 1 which covers the whole screen at less than 100% opacity
HTML:
<div id="cover> </div>
CSS:
#cover {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 10;
display: none;
background-color: #000000;
opacity: .7;
filter:progid:DXImageTransform.Microsoft.BasicImage(opacity=.7);
}
Then you can show the cover when you show your dialog, which needs to be at a yet higher z-index and remove the cover at the same time as your dialog:
Open:
$("#cover").show();
$("#fileupload").show( "slow" );
Close:
$("#fileupload").fadeOut( "slow" );
$("#cover").hide();
Julian
2009-02-12 14:31:54