非常漂亮的让背景如此暗淡（一种弹出提示信息时页面背景色调改变的方法）

更新时间：2007年04月26日 00:00:00 作者：

这个效果前些日子有人在论坛问起，今天有空研究了下。我打了原创标记，因为我在写这个方法时的确没有参考过别人的代码。我的方法其实就是层遮罩加ALPHA滤镜实现预期效果。

<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>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

非常漂亮的让背景如此暗淡（一种弹出提示信息时页面背景色调改变的方法）

纯 JS 实现的轻量化图片编辑器实例详解
这篇文章主要为大家介绍了纯JS实现的轻量化图片编辑器实例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2022-10-10
Web层改进II-用xmlhttp 无声息提交复杂表单
Web层改进II-用xmlhttp 无声息提交复杂表单...
2007-01-01
WEB 浏览器兼容推荐收藏
这是我总结多年的一个小文档，最近看见有人咨询浏览器兼容的问题，就贡献出来。
2010-05-05
JS获取并操作iframe中元素的方法
JS获取并操作iframe中元素的方法，需要的朋友可以参考一下
2013-03-03
ECMAScript6中Map映射的基本概念与常用方法
Map是ES6中新增的数据结构,Map类似于对象,但普通对象的 key 必须是字符串或者数字,而 Map 的 key 可以是任何数据类型,这篇文章主要给大家介绍了关于ECMAScript6中Map映射的基本概念与常用方法,需要的朋友可以参考下
2021-07-07
Js实现复选框的全选、全不选反选功能代码实例
这篇文章主要介绍了Js实现复选框的全选、全不选和反选,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
2020-02-02
Three.js利用orbit controls插件（轨道控制）控制模型交互动作详解
这篇文章主要给大家介绍了关于Three.js利用orbit controls插件，也就是轨道控制来控制模型交互动作的相关资料，文中通过示例代码介绍的非常详细，对大家具有一定的参考学习价值，需要的朋友们下面来一起看看吧。
2017-09-09
JS实现旋转木马轮播图
这篇文章主要为大家详细介绍了JS实现旋转木马轮播图，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-01-01
微信小程序 select 下拉框组件功能
这篇文章主要介绍了微信小程序 select 下拉框组件功能，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下
2019-09-09
小程序实现选择题选择效果
这篇文章主要为大家详细介绍了小程序实现选择题选择效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2018-11-11

非常漂亮的让背景如此暗淡（一种弹出提示信息时页面背景色调改变的方法）

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具