<div class="click">点击这里</div>
 <div class="click1">效果增强版的</div>
 <div class="bg"></div>
 <div class="content">这里是正文内容</div>

.bg{display:none;position:fixed;width:100%;height:100%;background:#000;z-index:2;top:0;left:0;opacity:0.7;}
.content{display:none;width:500px;height:300px;position:fixed;top:50%;margin-top:-150px;background:#fff;z-index:3;left:50%;margin-left:-250px;}

   $(function(){
		$('.click').click(function(){
			$('.bg').css({'display':'block'});
			$('.content').css({'display':'block'});
		});
		$('.bg').click(function(){
			//$('.bg').css({'display':'none'});
			//$('.content').css({'display':'none'});
		});
		$('.click1').click(function(){
			$('.bg').fadeIn(200);
			$('.content').fadeIn(400);
		});
		$('.bg').click(function(){
			$('.bg').fadeOut(200);
			$('.content').fadeOut(200);
		});
	});