用来设定元素透明度的 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多浏览器透明度兼容处理的更多相关文章

  1. CSS 之 Opacity多浏览器透明度兼容处理

    用来设定元素透明度的 Opacity 是CSS 3里的一个属性.当然现在还只有少部分浏览器支持. 不过各个浏览器都有自己的私有属性来支持,其中包括老版本的Mozilla和Safari: IE: fil ...

  2. Opacity多浏览器透明度兼容处理(转)

    用来设定元素透明度的 Opacity 是CSS 3里的一个属性.当然现在还只有少部分浏览器支持. 不过各个浏览器都有自己的私有属性来支持,其中包括老版本的Mozilla和Safari: IE: fil ...

  3. IE6 浏览器常见兼容问题 大汇总(23个)

    IE6以及各个浏览器常见兼容问题 大汇总 综述:虽然说IE6在2014年4月将被停止支持,但是不得不说的是,IE6的市场并不会随着支持的停止而立刻消散下去,对于WEB前端开发工程师来说,兼容IE6 兼 ...

  4. IE6 浏览器常见兼容问题 大汇总(23个)[转载]

    IE6以及各个浏览器常见兼容问题 大汇总 综述:虽然说IE6在2014年4月将被停止支持,但是不得不说的是,IE6的市场并不会随着支持的停止而立刻消散下去,对于WEB前端开发工程师来说,兼容IE6 兼 ...

  5. 强制浏览器使用兼容模式,Web.config,httpProtocol

    对于一些政府类的网站,很多支持IE6~8,而不支持使用更高版本浏览器浏览.虽然有些浏览器会自动使用兼容模式,或有些人会手动调整浏览器的兼容模式,但不是每一个人.每一款浏览器都可以做到用兼容模式.所以, ...

  6. JS--事件对象中部份浏览器不兼容方法

    测试时主要用的浏览器是Firefox 28.0.IE11.IE8.Chrome 34.0  一.什么是事件对象:当触发某个事件的时候,会产生一个事件对象,这个对象包含着所有的与事件有关的信息,包括导致 ...

  7. 浏览器 CSS 兼容写法的测试总结

    做前端最讨厌的就是 IE6,7,8,虽然被淘汰的浏览器,但是在中国用户仍然很多,不可能像国外网站一样直接就不管它了,这样会流失很多流量啊. 现在有了IE9,IE10还好些,几乎和 Chrome,Fir ...

  8. Modernizr 测试浏览器是否兼容相应属性

    Modernizr  测试浏览器是否兼容相应属性

  9. Normalize.css源码注释翻译&浏览器css兼容问题的理解

    版本v5.0.0源码地址: https://necolas.github.io/normalize.css/5.0.0/normalize.css 翻译版: /*! normalize.css v5. ...

随机推荐

  1. 关于z-index

    某些情况下z-index设置多高都不起作用. 1.这种情况有三个前提条件:父标签position属性为relative:问题标签无position属性(不包括static):问题标签含有浮动(floa ...

  2. DIOCP之编写第一个应用程序(一)

    Server 设计功能如下: 1.支持客户端登录 2.连接数据库进行操作 3.推送信息 4.限制文件上传大小 第一步:创建一个VCL-Forms Application(创建一个标准VCL程序) 第二 ...

  3. ES 集群

    http://www.cnblogs.com/o-andy-o/p/5067184.html

  4. Markdown 快速入门

    使用Markdown编辑器:MarkdownPad 2 标题: # 标题 ## 标题 ### 标题 #### 标题 ##### 标题 ###### 标题 效果: 标题 标题 标题 标题 标题 标题 下 ...

  5. Linux secure boot(安全启动)时添加Nvidia显卡驱动

    开启Secure boot情况下,在Fedora 21下安装Nvidia 显卡驱动的方法. Nvidia显卡驱动可以从官网上下载最新版>> 点击进入 下载后添加可执行权限: #chmod ...

  6. quartz学习

    quartz是一个作业调度框架,用于指定工作(作业)在指定时间执行——定时工作. quartz的核心接口有: Scheduler接口:Scheduler是job的执行对象,用于工作的执行. Job接口 ...

  7. 转载 --ios 模型-setValuesForKeysWithDictionary

    应用场景:app请求后端数据,返回的数据是JSON形式,如: { "is_favor" = 0; "is_follow" = 0; "is_prais ...

  8. EXCEL拼接SQL

    =CONCATENATE("insert into 表名 (字段名1,字段名2)values (3,  '"&C3&"');") 用CONCAT ...

  9. 05-Java中的String类

    程序设计思路: 首先目标是使输入的字符串加上某个数变成另一个字符串,从而相当于对字符串进行加密. 第一步输入一个字符串String类型: 第二步把这个字符串转变成字符数组: 第三步让这个数组的每一个字 ...

  10. AutoCad2008 部分快捷键

    编组开关:  Ctrl+Shift+A 查看扩展属性命令: xdlist 加载新的菜单栏命令:menu