注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

秦时明月

做好今天的事!

 
 
 

日志

 
 
 
 

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

2014-06-17 17:02:32|  分类: css |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |


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

用来设定元素透明度的 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来设定一个元素为半透明:

1Opacity多浏览器透明度兼容处理 - 寻找丢弃的时间 - 寻找丢弃的时间的博客.object.filter = "alpha(opacity=" + opacity + ")";  /* IE */
2Opacity多浏览器透明度兼容处理 - 寻找丢弃的时间 - 寻找丢弃的时间的博客.object.MozOpacity = (opacity / 100);    /* 老版Mozilla */
3Opacity多浏览器透明度兼容处理 - 寻找丢弃的时间 - 寻找丢弃的时间的博客object.KhtmlOpacity = (opacity / 100);    /* 老版Safari */
4Opacity多浏览器透明度兼容处理 - 寻找丢弃的时间 - 寻找丢弃的时间的博客object.opacity = (opacity / 100);    /* 支持opacity的浏览器*/
5

  评论这张
 
阅读(3)| 评论(0)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017