标题:如何使用showModalDialog打开页面,主页面变为黑色。
只看楼主
ysf0181
Rank: 16Rank: 16Rank: 16Rank: 16
等 级:版主
威 望:55
帖 子:914
专家分:2385
注 册:2006-10-4
结帖率:76.71%
已结贴  问题点数:10 回复次数:5 
如何使用showModalDialog打开页面,主页面变为黑色。
function newsearch(murl,width,height)
{  
 murl = encodeURI(murl);
 var obj = window.showModalDialog(murl,window,"dialogWidth="+width+"px;dialogHeight="+height+"px;status=no;help=no;");
  if(obj == 1)//判断是否刷新
 {
  //alert('刷新');
  window.location.reload();
  
 }
 else if(obj == 2)//判断是否刷新
 {
  //alert('刷新');
  window.location='test.asp';
  window.close();
 }  
 else{
 window.location.reload();
 }
  //window.location.href =window.location.href; //刷新父窗口
 // window.returnValue==1
 //window.location.reload(); //刷新父窗口
 //dialogArguments.close();

   //alert(str);
 }
搜索更多相关主题的帖子: 黑色 页面 
2010-10-16 13:05
ysf0181
Rank: 16Rank: 16Rank: 16Rank: 16
等 级:版主
威 望:55
帖 子:914
专家分:2385
注 册:2006-10-4
得分:0 

没有人会吗?

ASP讨论QQ群:251346273
2010-10-16 19:52
lele2007
Rank: 5Rank: 5
来 自:广东省深圳
等 级:职业侠客
威 望:6
帖 子:1028
专家分:305
注 册:2007-9-4
得分:10 
程序代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.">
<html xmlns="http://www.">
<head>
<style type="text/css">
body{
    margin:0;
    padding:0;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>乐乐</title>
<script language="javascript">
//创建一个遮罩层
function Layer(htmlContent)
{
    //创建一个遮罩层,半透明
    //------------------我是谁?我是割线!-----------------//
    var lay = document.createElement("div");
    lay.id = "frame"
    with(lay.style)
    {
        width = "100%";
        height = document.documentElement.scrollHeight + "px";
        height = String(Math.max(document.documentElement.clientHeight,document.documentElement.scrollHeight))+"px";
        background = "#000000";
        position = "absolute";
        left = "0";
        top = "0";
        filter = 'Alpha(opacity=50)';
        opacity = '0.5';
    }
    document.body.appendChild(lay);
  

    //创建显示内容
    var info = document.createElement("div");
    info.id = "msg";
    info.innerHTML = htmlContent;
    document.getElementById("frame").appendChild(info);
    with(info.style)
    {
        position = "absolute";
        left = "0px";
        top = document.documentElement.scrollTop + "px";
        marginLeft = (document.documentElement.clientWidth - info.clientWidth)/2 + "px";
        marginTop = (document.documentElement.clientHeight - info.clientHeight)/2 + "px";
    }
    document.body.appendChild(info);
}

//关闭遮罩层
function hiddenDiv()
{
    document.body.removeChild(document.getElementById("frame"));
    document.body.removeChild(document.getElementById("msg"));
}
window.onload = function()
{
  var html = '<input type="button" value="弹层" onclick="Layer(\'<img src=http://pass.bccn.net/data/avatar/000/19/06/20_avatar_middle.jpg onclick=hiddenDiv()>\')" /><input type="button" value="弹层2" onclick="Layer(\'<img src=http://bbs.bccn.net/images/default/logo.gif onclick=hiddenDiv()>\')" /><br>内容';
  for(i=1;i<30;i++){document.getElementById("lele").innerHTML += html;}
}
</script>
</head>

<body>
<div id="lele"></div>

</body>
</html>

背景变半透明。。试一下这个效果。

[ 本帖最后由 lele2007 于 2010-10-17 01:16 编辑 ]

学习编程www.
2010-10-17 01:14
yms123
Rank: 16Rank: 16Rank: 16Rank: 16
等 级:版主
威 望:209
帖 子:12488
专家分:19042
注 册:2004-7-17
得分:0 
那个不是使用showmodalDialog实现的百度搜索lightbox就是这种效果,网上有不少教程
2010-10-17 13:27
ysf0181
Rank: 16Rank: 16Rank: 16Rank: 16
等 级:版主
威 望:55
帖 子:914
专家分:2385
注 册:2006-10-4
得分:0 
谢谢。。。。。。。。。。。。。。。。。。。。没有实例吗。



[ 本帖最后由 ysf0181 于 2010-10-17 20:40 编辑 ]

ASP讨论QQ群:251346273
2010-10-17 18:15
ysf0181
Rank: 16Rank: 16Rank: 16Rank: 16
等 级:版主
威 望:55
帖 子:914
专家分:2385
注 册:2006-10-4
得分:0 
程序代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.">
<html xmlns="http://www.">
<head>
<style type="text/css">
body{
    margin:0;
    padding:0;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>乐乐</title>
<script language="javascript">
function newsearch(murl,width,height)
{ 

 murl = encodeURI(murl);

 var obj = window.showModalDialog(murl,window,"dialogWidth="+width+"px;dialogHeight="+height+"px;status=no;help=no;");
  if(obj == 1)//判断是否刷新

 {
  //alert('刷新');
  window.location.reload();

 

 }

 else if(obj == 2)//判断是否刷新

 {
  //alert('刷新');
  window.location='test.asp';
  window.close();

 } 

 else{

 window.location.reload();

 }
  //window.location.href =window.location.href; //刷新父窗口

 // window.returnValue==1

 //window.location.reload(); //刷新父窗口

 //dialogArguments.close();

   //alert(str);

 }
//window.showModalDialog 的调用结束


//创建一个遮罩层
function Layer(htmlContent)
{
    //创建一个遮罩层,半透明
    //------------------我是谁?我是割线!-----------------//
    var lay = document.createElement("div");
    lay.id = "frame"
    with(lay.style)
    {
        width = "100%";
        height = document.documentElement.scrollHeight + "px";
        height = String(Math.max(document.documentElement.clientHeight,document.documentElement.scrollHeight))+"px";
        background = "#000000";
        position = "absolute";
        left = "0";
        top = "0";
        filter = 'Alpha(opacity=50)';
        opacity = '0.5';
    }
    document.body.appendChild(lay);
   
   // newsearch('123.html?Rnd='+ Math.random(),450,350);
  

    //创建显示内容
    var info = document.createElement("div");
    info.id = "msg";
    info.innerHTML = htmlContent;
    document.getElementById("frame").appendChild(info);
    with(info.style)
    {
        position = "absolute";
        left = "0px";
        top = document.documentElement.scrollTop + "px";
        marginLeft = (document.documentElement.clientWidth - info.clientWidth)/2 + "px";
        marginTop = (document.documentElement.clientHeight - info.clientHeight)/2 + "px";
    }
    document.body.appendChild(info);
}

//关闭遮罩层
function hiddenDiv()
{
    document.body.removeChild(document.getElementById("frame"));
    document.body.removeChild(document.getElementById("msg"));
}
window.onload = function()
{
  var html = '<input type="button" value="弹层" onclick="Layer(\'<img src=http://pass.bccn.net/data/avatar/000/19/06/20_avatar_middle.jpg onclick=hiddenDiv()>\')" /><input type="button" value="弹层2" onclick="Layer(\'<img src=http://bbs.bccn.net/images/default/logo.gif onclick=hiddenDiv()>\')" /><br>内容';
  for(i=1;i<30;i++){document.getElementById("lele").innerHTML += html;}
}
</script>
</head>

<body>
<div align="center"><br>
<input type="button" value="通过调用覆盖层,再次调用 window.showModalDialog" onclick="Layer(' ');newsearch('123.html?Rnd='+ Math.random(),450,350);
" />
</div>
<div id="lele"></div>

</body>
</html>



[ 本帖最后由 ysf0181 于 2010-10-17 21:26 编辑 ]

ASP讨论QQ群:251346273
2010-10-17 20:52



参与讨论请移步原网站贴子:https://bbs.bccn.net/thread-323059-1-1.html




关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.183820 second(s), 8 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved