How to make browser fade out by showing popup
I often come across sites that respond to clicking on a "What is this" or "Gallery" link by opening a window in front of the original page and making the original page dim.
Is this a fantastic AJAX trick?
Perhaps it will only be supported in some browsers?
And most importantly, how is it done?
+2
source to share
1 answer
This is nothing more than an add- <DIV>
on that covers the entire screen and gives it a black background. The jQuery UI library will handle this for you automatically.
http://jqueryui.com/demos/dialog/#modal
Or you can do it with basic HTML / CSS / jQuery like this:
div.modal-bg {
background:#000;
position:fixed;
top:0; left:0;
width:100%;
height:100%;
z-index:10;
}
<div class="modal-bg"></div>
$(function(){
$("div.modal-bg").fadeTo("slow", .5);
});
+4
source to share