$("#fade").hide(); $(".show_hide").show(); $('.show_hide').click(function nos() { $("#fade").fadeToggle("fast"); });
.wrap{margin: 25px;} #fade { height:100%; width:100%; background-color: rgba(0, 0, 0, 0.7); padding:0; margin:0; border:0; position:absolute; overflow:hidden; left:0px; top:0px; display:block; } .cont{ margin:10% auto 0 auto; width:300px; height:300px; background-color: #FFF; -moz-box-shadow: 0 0 100px 1px #444; -webkit-box-shadow: 0 0 100px 1px #444; font-size:20px; }
<div class="wrap"><a href="javascript:void(0);" class="show_hide">Show/hide</a> <p> Lorem ipsum ... </p> <div id="fade"> <div class="cont"> Show Window! XD <br> <a href="javascript:void(0);" class="show_hide">hide</a></div></div> </div>