怎么弹出新层使父窗口不能被操作就像模式对话框
日期：2014-05-18 浏览次数：20444 次
如何弹出新层使父窗口不能被操作就像模式对话框？
也就是用div来模拟模式对话框
------解决方案--------------------
那就用 asp.net + ajax 的 modalPopupExtender
------解决方案--------------------
放入个隐藏层,
类似于windows关机效果,
网上多的去了
例如
<html>
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=utf-8 ">
<title> 无标题文档 </title>
<script> function $(v) { return(document.getElementById(v)); }
function $S(v) { return($(v).style); }
function agent(v) { return(Math.max(navigator.userAgent.toLowerCase
().indexOf(v),0)); }
function isset(v) { return((typeof(v)== 'undefined ' || v.length==0)?
false:true); }
function XYwin(v) { var z=agent( 'msie ')?Array
(document.body.clientHeight,document.body.clientWidth):Array
(window.innerHeight,window.innerWidth); return(isset(v)?z[v]:z); }
function sexyTOG() { document.onclick=function(){ $S
( 'sexyBG ').display= 'none '; $S( 'sexyBOX ').display= 'none ';
document.onclick=function(){}; }; }
function sexyBOX(t,v,b) {
$S( 'sexyBG ').height=XYwin(0)+ 'px ';
$S( 'sexyBG ').display= 'block ';
$( 'sexyBOX ').innerHTML= " <div
class=\ "sexyT\ "> "+t+ " <\/div> "+v+ " <div class=\ "sexyX\ "
onMouseMove=\ "setTimeout( 'sexyTOG() ',1);\ " onMouseOut=\ "setTimeout
( 'document.onclick=function(){} ',1);\ " style=\ "cursor:pointer;\ "> (关
闭) "+ " <\/div> ";
$S( 'sexyBOX ').left=Math.round((XYwin(1)-b)/2)+ 'px ';
$S( 'sexyBOX ').width=b+ 'px ';
$S( 'sexyBOX ').display= 'block '; }
window.onload=function(){
document.body.innerHTML= " <div id=\ "sexyBG\ "> </div> <div
id=\ "sexyBOX\ "> </div> "+document.body.innerHTML;
}
</script>
<style type= "text/css ">
<!--
body {margin: 0px;}
#sexyBG { display: none; position: absolute; background: #000;
opacity: 0.4; -moz-opacity: 0.4; -khtml-opacity: 0.4; filter: alpha
(opacity=60); width: 100%; height: 100%; }
#sexyBOX { display: none; position: absolute; background: #b9e77b;
color: #333; text-align: center; border: 1px solid #636D61; top:
70px; z-index: 100; }
.sexyX { font-size: 12px; color: #ddd; padding: 4px 0; border-top:
1px solid #636D61; background: #778574; }
.sexyT { font-size: 14px; text-align:left; font-weight:bold; color:
#fff; padding: 4px 0; border-down: 1px solid #636D61;
background:#434A42; }
-->
</style>
</head>
<body>
<a href= "# " onclick= "sexyBOX( '标题 ', '这里是一个弹出窗口! <br> <a
href=\ '#\ '> URL </a> ', '300 '); return false; "> sexy box </a>
</body>
</html>
------解决方案--------------------
楼上正解
------解决方案--------------------
mark
也就是用div来模拟模式对话框
------解决方案--------------------
那就用 asp.net + ajax 的 modalPopupExtender
------解决方案--------------------
放入个隐藏层,
类似于windows关机效果,
网上多的去了
例如
<html>
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=utf-8 ">
<title> 无标题文档 </title>
<script> function $(v) { return(document.getElementById(v)); }
function $S(v) { return($(v).style); }
function agent(v) { return(Math.max(navigator.userAgent.toLowerCase
().indexOf(v),0)); }
function isset(v) { return((typeof(v)== 'undefined ' || v.length==0)?
false:true); }
function XYwin(v) { var z=agent( 'msie ')?Array
(document.body.clientHeight,document.body.clientWidth):Array
(window.innerHeight,window.innerWidth); return(isset(v)?z[v]:z); }
function sexyTOG() { document.onclick=function(){ $S
( 'sexyBG ').display= 'none '; $S( 'sexyBOX ').display= 'none ';
document.onclick=function(){}; }; }
function sexyBOX(t,v,b) {
$S( 'sexyBG ').height=XYwin(0)+ 'px ';
$S( 'sexyBG ').display= 'block ';
$( 'sexyBOX ').innerHTML= " <div
class=\ "sexyT\ "> "+t+ " <\/div> "+v+ " <div class=\ "sexyX\ "
onMouseMove=\ "setTimeout( 'sexyTOG() ',1);\ " onMouseOut=\ "setTimeout
( 'document.onclick=function(){} ',1);\ " style=\ "cursor:pointer;\ "> (关
闭) "+ " <\/div> ";
$S( 'sexyBOX ').left=Math.round((XYwin(1)-b)/2)+ 'px ';
$S( 'sexyBOX ').width=b+ 'px ';
$S( 'sexyBOX ').display= 'block '; }
window.onload=function(){
document.body.innerHTML= " <div id=\ "sexyBG\ "> </div> <div
id=\ "sexyBOX\ "> </div> "+document.body.innerHTML;
}
</script>
<style type= "text/css ">
<!--
body {margin: 0px;}
#sexyBG { display: none; position: absolute; background: #000;
opacity: 0.4; -moz-opacity: 0.4; -khtml-opacity: 0.4; filter: alpha
(opacity=60); width: 100%; height: 100%; }
#sexyBOX { display: none; position: absolute; background: #b9e77b;
color: #333; text-align: center; border: 1px solid #636D61; top:
70px; z-index: 100; }
.sexyX { font-size: 12px; color: #ddd; padding: 4px 0; border-top:
1px solid #636D61; background: #778574; }
.sexyT { font-size: 14px; text-align:left; font-weight:bold; color:
#fff; padding: 4px 0; border-down: 1px solid #636D61;
background:#434A42; }
-->
</style>
</head>
<body>
<a href= "# " onclick= "sexyBOX( '标题 ', '这里是一个弹出窗口! <br> <a
href=\ '#\ '> URL </a> ', '300 '); return false; "> sexy box </a>
</body>
</html>
------解决方案--------------------
楼上正解
------解决方案--------------------
mark
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
