请教一个弹出提示框背景变暗的问题

可乐是我 2009-10-23 03:47:04
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>弹出提示框背景变暗</title>
<script>
function event(){
document.all.ly.style.display="block";
document.all.ly.style.width=document.body.clientWidth;
document.all.ly.style.height=document.body.clientHeight;
document.all.Layer2.style.display='block';
}
</script>
</head>

<body onLoad="event();">
<iframe src="http://www.baidu.com" width="100%" height="750" frameborder="0" scrolling="no"></iframe>
<div id="no">
<div id="ly" style="position:absolute;top:0px;FILTER: alpha(opacity=30);background-color:#777; z-index:2; left: 0px;display:none;"> </div>
<!-- 浮层框架开始 -->
<div id="Layer2" align="center" style="position:absolute; z-index:3; width: 540; height:170px;left:expression((document.body.offsetWidth-540)/2); top: expression((document.body.offsetHeight-170)/2);background-color:#fff;display:none;" valign="center">
<TABLE width=540 height=170 border=0 cellpadding=0 cellspacing=0 style="border:0 solid #e7e3e7;border-collapse: collapse">
<TR>
<TD style="background-color:#73A2d6;color:#fff;padding-left:4px;padding-top:2px;font-weight:bold;font-size:14px;" height=27 valign="center">[ 警 告 ]</TD>
</TR>
<TR>
<TD align="center" valign="center">提示内容</TD>
</TR>
<TR>
<TD height=30 align="center"><a href=# onclick="no.style.display='none'">确定</a></TD>
</TR>
</TABLE>
</div>
<!-- 浮层框架结束 -->
</div>
</body>
</html>
我这代码弹出提示框 可背景变暗为什么只有下面一小块 下面的还是白白的
如何能让他变成全屏变暗呢？
谢谢
...全文
202 5 打赏 收藏 转发到动态 举报
写回复
用AI写文章
5 条回复
切换为时间正序
请发表友善的回复…
发表回复
可乐是我 2009-10-23
  • 打赏
  • 举报
 回复
可以了 感谢楼上的
BeenZ 2009-10-23
  • 打赏
  • 举报
 回复
css太乱,改了下.好了




<style type="text/css">

<!--

html,body {height:100%; margin:0px; font-size:12px;}



.mydiv {

background-color: #f9fff6;

border: 1px solid #009900;

text-align: center;

line-height: 25px;

font-size: 13px;

font-weight: bold;

z-index:99;

width: 300px;

height: 50px;

left:50%;/*FF IE7*/

top:50%;/*FF IE7*/



margin-left:-150px!important;/*FF IE7 half of its width */

margin-top:-60px!important;/*FF IE7 half of its height*/



margin-top:0px;



position:fixed!important;/*FF IE7*/

position:absolute;/*IE6*/



_top:       expression(eval(document.compatMode &&

            document.compatMode=='CSS1Compat') ?

            documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/

            document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/



}





.bg {

background-color: #C2BEBF;

width: 100%;

height: 100%;

left:0;

top:0;/*FF IE7*/

filter:alpha(opacity=40);/*IE*/

opacity:0.4;/*FF*/

z-index:1;



position:fixed!important;/*FF IE7*/

position:absolute;/*IE6*/



_top:       expression(eval(document.compatMode &&

            document.compatMode=='CSS1Compat') ?

            documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/

            document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/



} 

--> 

</style>

<script language="javascript" type="text/javascript">

function showDiv(){

if(document.all){

    document.getElementById('bg').innerHTML = "<iframe style='width:100%;height:100%;left:0px;top:0px;position:absolute;filter:alpha(opacity=0);z-index:-1;border:0px'/>";

}

document.getElementById('popDiv').style.display='block';

document.getElementById('bg').style.display='block';

}



function closeDiv(){

document.getElementById('popDiv').style.display='none';

document.getElementById('bg').style.display='none';

}



</script>



 <TABLE  id="popDiv" class="mydiv" style="display:none;">

      <TR>

          <TD style="background-color:#73A2d6;color:#fff;padding-left:4px;padding-top:2px;font-weight:bold;font-size:14px;" height=27 valign="center">[ 警 告 ] </TD>

      </TR>

      <TR>

          <TD align="center" valign="center">提示内容 </TD>

      </TR>

      <TR>

          <TD height=30 align="center"> <a href=# onclick="closeDiv()">确定 </a> </TD>

      </TR>

  </TABLE>

<div id="bg" class="bg" style="display:none;">



</div>







<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>弹出半透明层 (支持IE FF)</title>



</head>



<body onload="showDiv()">

<iframe src="http://www.baidu.com" width="100%" height="100%" frameborder="0" scrolling="no"> </iframe>

</body>

</html>
可乐是我 2009-10-23
  • 打赏
  • 举报
 回复
有没一个比较完美的方案呀
可乐是我 2009-10-23
  • 打赏
  • 举报
 回复
还是没满屏变暗啊 滚动条拉到下面来还是白白的一块
BeenZ 2009-10-23
  • 打赏
  • 举报
 回复
css属性兼容问题,给你改了


<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>弹出提示框背景变暗 </title>



<script>

  function event(){

      document.all.ly.style.display="block";

      document.all.ly.style.width=document.body.clientWidth;

      document.all.ly.style.height=document.body.clientHeight;

      document.all.Layer2.style.display='block';

  }

</script>

</head>



<body onLoad="event();">

<iframe src="http://www.baidu.com" width="100%" height="750" frameborder="0" scrolling="no"> </iframe>

<div id="no">

<div id="ly" style="position:absolute;top:0px;opacity:0.3;  FILTER: alpha(opacity=30);background-color:#777; z-index:2; left: 0px;display:none;"> </div>

<!--  浮层框架开始  -->

      <div id="Layer2" align="center" style="position:absolute; z-index:3; width: 540; height:170px;left:30%; top:30%;background-color:#fff;display:none;" valign="center">

  <TABLE width=540 height=170 border=0 cellpadding=0 cellspacing=0 style="border:0 solid #e7e3e7;border-collapse: collapse">

      <TR>

          <TD style="background-color:#73A2d6;color:#fff;padding-left:4px;padding-top:2px;font-weight:bold;font-size:14px;" height=27 valign="center">[ 警 告 ] </TD>

      </TR>

      <TR>

          <TD align="center" valign="center">提示内容 </TD>

      </TR>

      <TR>

          <TD height=30 align="center"> <a href=# onclick="no.style.display='none'">确定 </a> </TD>

      </TR>

  </TABLE>

    </div>

<!--  浮层框架结束  -->

</div>

</body>

</html>
ThinkPHP5生成二维码及背景图片合成
二维码是我们在开发网站和项目的时候经常遇到的，我第一次接触二维码时，翻过许多资料，也请教许多所谓高人，被整的还是一头雾水，于是自己下决心一定搞明白二维码到底怎么回事，在经历许多坑，花费许多时间和精力后...
ssm框架搭建的配置文件以及单元测试中遇到的问题
自己不懂后台还硬要跟着视频做ssm，当然就是一步...1、eclipse为什么会出现maven依赖包的图标颜色变暗的这种情况，且引入类时报错； 原因：在pom-xml中， <dependency> <groupId>junit</groupId> &
springboot042养老服务管理系统(vue)
论文的章节概述主要是对论文的一个宏观全局的看，那么首先第一章是绪论部分，是对于课题的研究背景以及所研究的思路和方法，以及现阶段我国和国内外所存在的研究差异导致的原因进行一个有效的分析；那么第二章节就是...
精进：如何成为一个很厉害的人--作者：采铜
精进：如何成为一个很厉害的人 作者：采铜 文章目录精进：如何成为一个很厉害的人序 用更勇敢的方式去生活01 时间之尺 我们应该怎样对待时间活在“全部的现在” 从当下出发，联结过去与未来那么，一个人应该怎样对待...
《红楼梦》的作者真的是曹雪芹吗？
随狂风去​尚书令等 19,569 人赞同了该回答作者名字确实是叫...自从胡适提出“曹府论”后，很多红学家和爱好者以此为基础，从红学中另开辟出一个分支“曹学”，可惜这么多年过去，这个曹学并没有研究出什么让人信服的
CSS

61,111

社区成员

60,732

社区内容

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章