用来设定元素透明度的 Opacity 是CSS 3里的一个属性。当然现在还只有少部分浏览器支持。

不过各个浏览器都有自己的私有属性来支持,其中包括老版本的Mozilla和Safari:

IE: filter:alpha(opacity) 
Mozilla: -moz-opacity 
Safari: -khtml-opacity 
很不幸的是,你没看见Opera,老版本的Opera并没有什么私有属性可以代替opacity。(新版Opera已经支持opacity)

所以以前用CSS设定一个元素半透明的话,可能会这样写:

1 .opacity{
2  filter:alpha(opacity=50);       /* IE */
3  -moz-opacity:0.5;              /* 老版Mozilla */
4  -khtml-opacity:0.5;              /* 老版Safari */
5  opacity: 0.5;           /* 支持opacity的浏览器*/
6 }

用javascript来设定一个元素为半透明:

1.object.filter = "alpha(opacity=" + opacity + ")";  /* IE */
2.object.MozOpacity = (opacity / 100);    /* 老版Mozilla */
3object.KhtmlOpacity = (opacity / 100);    /* 老版Safari */
4object.opacity = (opacity / 100);    /* 支持opacity的浏览器*/
5

Opacity多浏览器透明度兼容处理(转)的更多相关文章

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

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

  2. CSS 之 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. winscp配置

    WinSCP Install and run WinSCP Go to Preferences (Ctrl+Alt+P) and click on Transfer, then on Add. Nam ...

  2. cadence异型孔

    1:画route path的边框,画在board geometry的ncroute_path层上,可以用zcopy (暂时没用过)      没有的话可能:WARNING: No route path ...

  3. 【整理】Visual Studio快捷键

    说明 很多开发人员使用Visual Studio的时候,由于对VS快捷键不熟悉,会影响到实际的开发效率.其实,有很多我们不知道(或已知)的快捷键,在我们熟练运用以后,能够提高我们整体的工作效率.以下是 ...

  4. JS数组(Array)操作汇总

    1.去掉重复的数组元素.2.获取一个数组中的重复项.3.求一个字符串的字节长度,一个英文字符占用一个字节,一个中文字符占用两个字节.4.判断一个字符串中出现次数最多的字符,统计这个次数.5.数组排序. ...

  5. <Stackoverflow> 如何提问

    如何提问 欢迎来到Stack Overflow! 我们很乐意帮助你,但是实际情况是并非每一个问题都能得到解决.为了提高你的机会,这儿有一些帮助: 1 检索及调查 在提出你的问题之前,你已经通过检索来寻 ...

  6. 改变seekbar的游标图片大小

    url: http://stackoverflow.com/questions/9699951/changing-size-of-seekbar-thumb The most flexible way ...

  7. TCL/Expect交互式自动化测试概要 - - ITeye技术网站

    TCL/Expect交互式自动化测试概要 - - ITeye技术网站 expect是一种基于TCL,能与交互式程序进行"可程序化"会话的脚本语言,是一种可以提供"分支和嵌 ...

  8. DelphiXE Android的所有权限按照分类总结说明

    相关资料:http://www.delphitop.com/html/Android/2778.html   网络相关的: android.permission.INTERNET 允许程序打开网络套接 ...

  9. nyoj 10 skiing(记忆化搜索)

    skiing 时间限制:3000 ms  |  内存限制:65535 KB 难度:5   描述 Michael喜欢滑雪百这并不奇怪, 因为滑雪的确很刺激.可是为了获得速度,滑的区域必须向下倾斜,而且当 ...

  10. CentOS查看系统信息-CentOS查看命令

    一:查看cpu more /proc/cpuinfo | grep "model name" grep "model name" /proc/cpuinfo 如 ...