Opacity多浏览器透明度兼容处理
用来设定元素透明度的 Opacity 是CSS 3里的一个属性。当然现在还只有少部分浏览器支持。
不过各个浏览器都有自己的私有属性来支持,其中包括老版本的Mozilla和Safari:
IE: filter:alpha(opacity)
Mozilla: -moz-opacity
Safari: -khtml-opacity
很不幸的是,你没看见Opera,老版本的Opera并没有什么私有属性可以代替opacity。(新版Opera已经支持opacity)
所以以前用CSS设定一个元素半透明的话,可能会这样写:
.opacity{
filter:alpha(opacity=50); /* IE */
-moz-opacity:0.5; /* 老版Mozilla */
-khtml-opacity:0.5; /* 老版Safari */
opacity: 0.5; /* 支持opacity的浏览器*/
}
用javascript来设定一个元素为半透明:
.object.filter = "alpha(opacity=" + opacity + ")"; /* IE */
.object.MozOpacity = (opacity / 100); /* 老版Mozilla */
object.KhtmlOpacity = (opacity / 100); /* 老版Safari */
object.opacity = (opacity / 100); /* 支持opacity的浏览器*/
效果如下图:

Opacity多浏览器透明度兼容处理的更多相关文章
- CSS 之 Opacity多浏览器透明度兼容处理
用来设定元素透明度的 Opacity 是CSS 3里的一个属性.当然现在还只有少部分浏览器支持. 不过各个浏览器都有自己的私有属性来支持,其中包括老版本的Mozilla和Safari: IE: fil ...
- Opacity多浏览器透明度兼容处理(转)
用来设定元素透明度的 Opacity 是CSS 3里的一个属性.当然现在还只有少部分浏览器支持. 不过各个浏览器都有自己的私有属性来支持,其中包括老版本的Mozilla和Safari: IE: fil ...
- IE6 浏览器常见兼容问题 大汇总(23个)
IE6以及各个浏览器常见兼容问题 大汇总 综述:虽然说IE6在2014年4月将被停止支持,但是不得不说的是,IE6的市场并不会随着支持的停止而立刻消散下去,对于WEB前端开发工程师来说,兼容IE6 兼 ...
- IE6 浏览器常见兼容问题 大汇总(23个)[转载]
IE6以及各个浏览器常见兼容问题 大汇总 综述:虽然说IE6在2014年4月将被停止支持,但是不得不说的是,IE6的市场并不会随着支持的停止而立刻消散下去,对于WEB前端开发工程师来说,兼容IE6 兼 ...
- 强制浏览器使用兼容模式,Web.config,httpProtocol
对于一些政府类的网站,很多支持IE6~8,而不支持使用更高版本浏览器浏览.虽然有些浏览器会自动使用兼容模式,或有些人会手动调整浏览器的兼容模式,但不是每一个人.每一款浏览器都可以做到用兼容模式.所以, ...
- JS--事件对象中部份浏览器不兼容方法
测试时主要用的浏览器是Firefox 28.0.IE11.IE8.Chrome 34.0 一.什么是事件对象:当触发某个事件的时候,会产生一个事件对象,这个对象包含着所有的与事件有关的信息,包括导致 ...
- 浏览器 CSS 兼容写法的测试总结
做前端最讨厌的就是 IE6,7,8,虽然被淘汰的浏览器,但是在中国用户仍然很多,不可能像国外网站一样直接就不管它了,这样会流失很多流量啊. 现在有了IE9,IE10还好些,几乎和 Chrome,Fir ...
- Modernizr 测试浏览器是否兼容相应属性
Modernizr 测试浏览器是否兼容相应属性
- Normalize.css源码注释翻译&浏览器css兼容问题的理解
版本v5.0.0源码地址: https://necolas.github.io/normalize.css/5.0.0/normalize.css 翻译版: /*! normalize.css v5. ...
随机推荐
- information_schema.TABLES
获取所有表结构(TABLES) SELECT * FROM information_schema.TABLES WHERE TABLE_SCHEMA='数据库名'; TABLES表:提供了关于数据库中 ...
- OpenGL ES crash notes 01 - Nice to meet you
这篇笔记完全参照<OpenGL.ES.3.0.Programming.Guide.2nd.Edition>,摘出部分内容只为学习参考. 为什么要用英文:无论是D3D的SDK还是OES的Sp ...
- Scala包
#引入包的全部成员的办法 import scala.collection._ #引入同一个包中的几个成员 import scala.collection.{A,B} #重名 要 重命名 import ...
- Spring JDBC
转载:博客主页:http://blog.csdn.NET/chszs 一.概述 在Spring JDBC模块中,所有的类可以被分到四个单独的包:1)core即核心包,它包含了JDBC的核心功能.此包内 ...
- Oracle 命令行导出表
exp userid=帐号/密码 tables=(TOWN,YIZHI,一带一路企业) file=C:\Users\casm\Desktop\3tabs.dmp
- 【Android端 APP GPU过度绘制】GPU过度绘制及优化
一.Android端的卡顿 Android端APP在具体使用的过程中容易出现卡顿的情况,比如查看页面时出现一顿一顿的感受,切换tab之后响应很慢,或者具体滑动操作的时候也很慢. 二.卡顿的原因 卡顿的 ...
- IE6/IE7/IE8兼容H5标签
可以使用html5shiv(html5shiv主要解决HTML5提出的新元素不被IE6-8识别,这些新元素不能作为父节点包裹子元素,并且不能应用CSS样式)来解决 <!--[if lt IE 9 ...
- oracle分组后取每组第一条数据
数据格式: 分组取第一条的效果: sql语句: SELECT * FROM ( ;
- 决策树(含python源代码)
因为最近实习的需要,所以用python里的sklearn包重新写了一次决策树 工具:sklearn,http://www.lfd.uci.edu/~gohlke/pythonlibs/#numpy:将 ...
- CoreOS Hyper-V 安装
CoreOS Hyper-V 安装, Install to disck 准备 安装镜像 https://coreos.com/releases/ 选择版本, 点 Browse Images, 下载以下 ...