在一个html的界面上点连接弹出一个窗口,下面的html页面变灰色
在一个html的界面上点连接在当前页面上弹出一个窗口,下面的html页面变灰色后不能使用.谢谢...
在一个html的界面上点连接在当前页面上弹出一个窗口,下面的html页面变灰色后不能使用.谢谢
展开
3个回答
展开全部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html; charset=utf-8" />
<scripttype="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<title>点击显示遮罩层</title>
<styletype="text/css">
body { font: 12px Verdana, Arial, Helvetica, sans-serif; }
.mask { position: absolute; top: 0px; filter: alpha(opacity=60); background-color: #B2B2B2; z-index: 999; left: 0px; opacity: 0.5; -moz-opacity: 0.5; }
.content { display: none; padding: 25px 20px; width: 600px; border: 1px solid #b2b2b2; background: #fff; z-index: 1000; position: fixed; left: 25%; top: 20%; }
.content h3, .content p { padding: 10px; background: #888; color: #fff; }
#close { cursor: pointer; font-size: 20px; color: #888; position: absolute; top: 5px; right: 20px; }
#open1 { width: 90px; color: #000; cursor: pointer; padding: 10px; background: #888; color: #fff; }
</style>
<scripttype="text/javascript">
$(function(){
$("#open1").click(function(){
$("#mask").css({
"height":$(document).height(),
"width":$(document).width()
}).show();
})
$("#open1").click(function(){
$(".content").show();
})
$("#close").click(function(){
$(".content").hide();
$("#mask").hide();
})
})
</script>
</head>
<bodystyle="height:10000px">
<divid="mask"class="mask"></div>
<divid="open1">点击显示遮罩层</div>
<divclass="content">
<h3>HTML 5</h3>
<p>XHTML 是更严谨更纯净的 HTML 版本。</p>
<spanid="close">x</span>
</div>
</body>
</html>
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html; charset=utf-8" />
<scripttype="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<title>点击显示遮罩层</title>
<styletype="text/css">
body { font: 12px Verdana, Arial, Helvetica, sans-serif; }
.mask { position: absolute; top: 0px; filter: alpha(opacity=60); background-color: #B2B2B2; z-index: 999; left: 0px; opacity: 0.5; -moz-opacity: 0.5; }
.content { display: none; padding: 25px 20px; width: 600px; border: 1px solid #b2b2b2; background: #fff; z-index: 1000; position: fixed; left: 25%; top: 20%; }
.content h3, .content p { padding: 10px; background: #888; color: #fff; }
#close { cursor: pointer; font-size: 20px; color: #888; position: absolute; top: 5px; right: 20px; }
#open1 { width: 90px; color: #000; cursor: pointer; padding: 10px; background: #888; color: #fff; }
</style>
<scripttype="text/javascript">
$(function(){
$("#open1").click(function(){
$("#mask").css({
"height":$(document).height(),
"width":$(document).width()
}).show();
})
$("#open1").click(function(){
$(".content").show();
})
$("#close").click(function(){
$(".content").hide();
$("#mask").hide();
})
})
</script>
</head>
<bodystyle="height:10000px">
<divid="mask"class="mask"></div>
<divid="open1">点击显示遮罩层</div>
<divclass="content">
<h3>HTML 5</h3>
<p>XHTML 是更严谨更纯净的 HTML 版本。</p>
<spanid="close">x</span>
</div>
</body>
</html>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
添加一个无内容的层 宽度为100% 设置z-index比你的弹出窗口的小就好了
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
用弹出层就可以了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
