1.背景半透明效果的制作:
使用CSS实现,代码如下:
IE:filter:alpha(opacity=50);
FF: opacity: 0.5;
50和0.5都表示透明度为50%,数值越大透明度越低,越小则透明度越高
为了在这两种浏览器上都能正常显示,可以同时写在CSS中,示例代码如下
已在IE7和FF 3.0中测试通过,低版本未曾测试
#Layer1 {
position:absolute;
left:0px;
top:0px;
width:640px;
height:480px;
z-index:1; //将透明层置于其他层之上
background-color: #FF0000;
opacity: 0.5; //FF用法,也可用于支持CSS3的浏览器之上
filter:alpha(opacity=50); //只能用于IE之上
}
2.半透明效果的应用:
在使用DIV层模拟模式窗口时,效果不错,制作过程简要步骤如下:
当需要使用模式窗口时,显示出隐藏层模拟模式窗口,该层与页面同等大小,把页面完全覆盖住,使得页面无法接收事件,同时设定层的背景颜色和透明度,达到比较美观的效果,当处理完与用户的交互,再隐藏层,是页面重新显示。
showModalDialog方法尽量不要使用,非W3C标准,在新版本的FF上无法正常显示,使用DIV层模拟模式窗口,即美观兼容性又好。
分享到:
相关推荐
JavaScript学习笔记JavaScript学习笔记
个人Javascript学习笔记 精华版 个人Javascript学习笔记 精华版 个人Javascript学习笔记 精华版
JavaScript学习笔记,javascript基础知识,基础语法整理.pdf
详细的javascript学习笔记,DOM,BOM,AJAX等详细笔记!
javascript 学习笔记
挺好的javascript 学习笔记javascript 学习笔记javascript 学习笔记javascript 学习笔记javascript 学习笔记
javascript学习笔记
JavaScript学习笔记.pdf
javascript学习笔记讲解版参考.pdf
javaScript学习笔记总结.docx
JavaScript 学习笔记集和代码库JavaScript 学习笔记集和代码库JavaScript 学习笔记集和代码库JavaScript 学习笔记集和代码库JavaScript 学习笔记集和代码库JavaScript 学习笔记集和代码库JavaScript 学习笔记集和...
JavaScript学习笔记归纳.pdf
javascript学习笔记发放1,以后陆续发布。