原文发布时间为：2009-04-05 —— 来源于本人的百度文章 [由搬家工具导入]

有人会说，怎么网页用JavaScript会有安全提示，而其他网站上面用了JavaScript都没有安全提示，呵呵，那是因为你运行本地的网页会用安全提示，如果你网页放在服务器上面，让别人运行就不会有提示了。。呵呵，所以别担心了。。

第一个比较丑的，也比较简单的如下：

<html>
<head>
<title>LIGHTBOX EXAMPLE</title>
<style>
.black_overlay{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index:1001;
-moz-opacity: 0.2;
opacity:.20;
filter: alpha(opacity=20);
}
.white_content {
display: none;
position: absolute;
top: 25%;
left: 25%;
width: 50%;
height: 50%;
padding: 16px;
border: 16px solid orange;
background-color: white;
z-index:1002;
overflow: auto;
}
</style>
</head>
<body>
<p> 可以根据自己要求修改css样式<a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block'; document.getElementById('fade').style.display='block'">点击这里打开窗口</a></p>
<div id="light" class="white_content">This is the lightbox content. <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a></div>
<div id="fade" class="black_overlay"></div>
</body>
</html>

第二种做得比较好看：

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>提示信息框</title>
<style type="text/css">
a{ color:#000; font-size:12px;text-decoration:none}
a:hover{ color:#900; text-decoration:underline}
body{background:;filter:progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ffffff,endColorStr=#003366); overflow:hidden}
#massage_box{ position:absolute; left:expression((body.clientWidth-350)/2); top:expression((body.clientHeight-200)/2); width:350px; height:200px;filter:dropshadow(color=#666666,offx=3,offy=3,positive=2); z-index:2; visibility:hidden}
#mask{ position:absolute; top:0; left:0; width:expression(body.clientWidth); height:expression(body.clientHeight); background:#666; filter:ALPHA(opacity=60); z-index:1; visibility:hidden}
.massage{border:#036 solid; border-width:1 1 3 1; width:95%; height:95%; background:#fff; color:#036; font-size:12px; line-height:150%}
.header{background:#036; height:10%; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; padding:3 5 0 5; color:#fff}
</style>
</head><body>
<div id="massage_box"><div class="massage">
<div class="header"><div style="display:inline; width:150px; position:absolute">本站提示信息</div>
<span onClick="massage_box.style.visibility='hidden'; mask.style.visibility='hidden'" style="float:right; display:inline; cursor:hand">×</span></div>
<ul style="margin-right:25"><li>
本人申明此博客所有文章（包括文章插图）均为原创，如需引用或转载请注明出处。
</li><li>欢迎大家对博文中观点留言评述，谢绝无聊人士无素质无观点的灌水漫骂。</li><li>本站已设背景音乐，听音乐盒中收集的音乐时请先到页面底部关闭背景音乐。</li></ul></div></div>
<div id="mask"></div>
<span onClick="mask.style.visibility='visible';massage_box.style.visibility='visible'" style="cursor:hand"><a href="#">显示提示信息</a></span>
</body>
</html>

透明层提示框代替windows警告窗口方法！的更多相关文章

  1. JOptionPane类提示框的一些常用的方法

    JOptionPane类提示框的一些常用的方法 XMLOracleSwing 最近在做swing程序中遇到使用消息提示框的,JOptionPane类其中封装了很多的方法. 很方便的,于是就简单的整理了 ...

  2. Ubuntu12.04下eclipse提示框黑色背景色的修改方法

    eclipse提示框的背景颜色使用的是系统的提示框颜色配置,在windows下为黄色,但在Ubuntu12.04(gnome)下却是黑色,造成提示内容很难看清. 在eclipse中我们是无法修改这个颜 ...

  3. iOS：提示框(警告框)控件UIActionSheet的详解

    提示框(警告框)控件2:UIActionSheet 功能:当点击按钮或标签等时,弹出一个提示框,显示必要的提示,然后通过添加的按钮完成需要的功能.它与导航栏类似,它继承自UIView.   风格类型: ...

  4. easyui验证提示框 卡在屏幕上！！

    场景:验证提示框,关闭diglog窗口后 还显示在页面中 解决方法: 在窗口关闭事件中,删除提示框(这貌似并不可行),只能将验证提示框隐藏起来. $('#dialog').dialog({ onClo ...

  5. Selenium处理alert/confirm/prompt提示框

    About 回到顶部 重新认识alert首先,不是所有的alert都能叫做alert框.JavaScript中,关于消息提示框的方法有三个(虽然都跟alert差不多): alert(message)方 ...

  6. 如何使用CSS创建巧妙的动画提示框

    当你的用户需要一些额外的上下文来放置图标,或者当他们需要一些保证来点击按钮,或者可能是一个复活节彩蛋的标题来搭配一个图片时,工具提示是一个很好的方法来增强用户界面.现在让我们来制作一些动画工具提示,只 ...

  7. qt之透明提示框（模拟qq） （非常漂亮）

    Qt实现类似QQ的登录失败的提示框,主要涉及窗口透明并添加关闭按钮,以及图标和信息的显示等. 直接上代码: #include "error_widget.h" ErrorWidge ...

  8. 【提示框】【计时事件】【cookie】

    1.提示框 1)警告框 <script>function disp_alert(){alert("我是警告框!!")}</script> 2)确认框 fun ...

  9. Delphi中弹出提示框的四种方法

    参考:http://blog.itpub.net/8432156/viewspace-924843/ 更为详细的内容请参见:http://blog.csdn.net/akof1314/article/ ...

随机推荐

  1. js时间转换

    1. 将时间戳转换成日期格式 // 简单的一句代码 var date = new Date(时间戳); //获取一个时间对象 /** 1. 下面是获取时间日期的方法,需要什么样的格式自己拼接起来就好了 ...

  2. Python9-条件-定时器-队列-day40

    复习 线程 线程是进程中的执行单位 线程是cpu执行的最小单位 线程之间资源共享 线程的开启和关闭以及切换的时间开销远远小于进程 线程本身可以在同一时间使用多个cpu,python与线程 由于cpyt ...

  3. Labyrinth POJ - 1383

    Labyrinth POJ - 1383 The northern part of the Pyramid contains a very large and complicated labyrint ...

  4. 《鸟哥的Linux私房菜》学习笔记(4)——用户和组

    一.用户和组的基本概念                                              1.用户 用户:用于获取计算机资源或服务的标识符,比如用户名.计算机处理的是UID,用 ...

  5. Python中__str__和__repr__的区别

    Python有一个内置的函数叫repr,它能把一个对象用字符串的形式表达出来以便辨认,这就是“字符串表示形式”.repr就是通过__repr__这个特殊方法来得到一个对象的字符串表示形式.如果没有实现 ...

  6. Win 10激活

    Win10专业版激活(亲测有效) 来源:http://jingyan.baidu.com/article/295430f1ce2e880c7e0050ff.html 1.首先,我们先查看一下Win10 ...

  7. selenium随笔

    1.点击一个连接通常录制一个click命令,通常需要改变它到clickAndWait命令,确保案例暂停,新的页面完全被转载进来. 2.测试案例需要检查Web页的属性,需要assert和verify命令 ...

  8. c# 钩子程序

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.R ...

  9. Python之基于socket和select模块实现IO多路复用

    '''IO指的是输入输出,一部分指的是文件操作,还有一部分网络传输操作,例如soekct就是其中之一:多路复用指的是利用一种机制,同时使用多个IO,例如同时监听多个文件句柄(socket对象一旦传送或 ...

  10. js判断时间是否过期

    var myDate=new Date(); myDate.setFullYear(2014,2,1); //2014年3月1日 //注意:表示月份的参数介于 0 到 11 之间.也就是说,如果希望把 ...