透明层提示框代替windows警告窗口方法!
原文发布时间为: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警告窗口方法!的更多相关文章
- JOptionPane类提示框的一些常用的方法
JOptionPane类提示框的一些常用的方法 XMLOracleSwing 最近在做swing程序中遇到使用消息提示框的,JOptionPane类其中封装了很多的方法. 很方便的,于是就简单的整理了 ...
- Ubuntu12.04下eclipse提示框黑色背景色的修改方法
eclipse提示框的背景颜色使用的是系统的提示框颜色配置,在windows下为黄色,但在Ubuntu12.04(gnome)下却是黑色,造成提示内容很难看清. 在eclipse中我们是无法修改这个颜 ...
- iOS:提示框(警告框)控件UIActionSheet的详解
提示框(警告框)控件2:UIActionSheet 功能:当点击按钮或标签等时,弹出一个提示框,显示必要的提示,然后通过添加的按钮完成需要的功能.它与导航栏类似,它继承自UIView. 风格类型: ...
- easyui验证提示框 卡在屏幕上!!
场景:验证提示框,关闭diglog窗口后 还显示在页面中 解决方法: 在窗口关闭事件中,删除提示框(这貌似并不可行),只能将验证提示框隐藏起来. $('#dialog').dialog({ onClo ...
- Selenium处理alert/confirm/prompt提示框
About 回到顶部 重新认识alert首先,不是所有的alert都能叫做alert框.JavaScript中,关于消息提示框的方法有三个(虽然都跟alert差不多): alert(message)方 ...
- 如何使用CSS创建巧妙的动画提示框
当你的用户需要一些额外的上下文来放置图标,或者当他们需要一些保证来点击按钮,或者可能是一个复活节彩蛋的标题来搭配一个图片时,工具提示是一个很好的方法来增强用户界面.现在让我们来制作一些动画工具提示,只 ...
- qt之透明提示框(模拟qq) (非常漂亮)
Qt实现类似QQ的登录失败的提示框,主要涉及窗口透明并添加关闭按钮,以及图标和信息的显示等. 直接上代码: #include "error_widget.h" ErrorWidge ...
- 【提示框】【计时事件】【cookie】
1.提示框 1)警告框 <script>function disp_alert(){alert("我是警告框!!")}</script> 2)确认框 fun ...
- Delphi中弹出提示框的四种方法
参考:http://blog.itpub.net/8432156/viewspace-924843/ 更为详细的内容请参见:http://blog.csdn.net/akof1314/article/ ...
随机推荐
- Java - 若try中有return语句,finally会执行吗?在return之前还是之后呢?
会执行,在方法return动作之前,return语句执行之后,若finally中再有return语句,则此方法以finally的return作为最终返回,若finally中无return语句,则此方法 ...
- MultipartFile 动态决定是否上传文件,解决不上传文件报错
controller 接收参数 用 HttpServletRequest 代替 @RequestParam() 接收参数 picFile 前台 传文件的参数名字 , 这样 前段 传 nul ...
- linux几种文件传输方式
本文记录linux系统中文件传输的多种方式,留作备忘.linux中文件传输的方式有ftp,scp,rsync,rz,sz等,但各个工具的功能又有所区别: FTP : FTP是文件服务器,可实现文件的上 ...
- Shell脚本使用汇总整理——mysql数据库5.7.8以后备份脚本
Shell脚本使用汇总整理——mysql数据库5.7.8以后备份脚本 Shell脚本使用的基本知识点汇总详情见连接: https://www.cnblogs.com/lsy-blogs/p/92234 ...
- debug模式开启会做哪些事(源码分析)
以往开发中不管是django框架下开发还是其它框架下开发, 只知道在开发阶段要开启debug模式, 却一直没有深究它会我们做哪些事, 今天使用tornado时偶然看到源码中写的很清楚,故写下来加深印象 ...
- Nearest Common Ancestors POJ - 1330 (LCA)
Nearest Common Ancestors Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 34657 Accept ...
- WebView的初体验
使用安卓自带控件可以实现不通过浏览器即可上网的功能 突然就觉得安卓好强大,是不是我太无知了,太容易满足了 1.在layout中添加VebView控件 2.在Activity中设置WebView的属性 ...
- pyautogui 模块学习
在日常实施中,我们用控件对大部分的网页和客户端都能进行拾取操作.但是仍有一小部分的应用无法进行操作.这里我常用到 pyautogui 这个模块.下面做个分享. Python 的 pyautogui 模 ...
- laravel5.2总结--关联关系
参考文章 http://laravelacademy.org/post/1095.html http://laravelacademy.org/post/1174.html http://d.lar ...
- mof格式的文件怎么打开?用什么工具?
托管对象格式 (MOF) 文件是创建和注册提供程序.事件类别和事件的简便方法.在 MOF 文件中创建类实例和类定义后,可以对该文件进行编译.有关更多信息,请参见编译托管对象格式 (MOF) 文件.编译 ...