前端技术

当前位置:首页 > 前端技术 >

CSS3 opacity多浏览器透明度兼容处理

时间:2015-08-19        阅读:次        QQ群:182913345

用来设定元素透明度的 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的浏览器*/

上一篇:Javascript中undefined与null的区别

下一篇:AJAX POST跨域方案之CORS

扫一扫,更多精彩内容推送

PHP技术分享

分享PHP技术,前端技术,数据库,SEO优化,服务器,网络安全等知识,是php程序员工作学习的好帮手!

Copyright © 2013-2015.PHP技术分享 www.php520.cn  版权所有  网站地图    PHP学习交流群

免责声明:网站内容收集于互联网,本网站不承担任何由于内容的合法性及健康性所引起的争议和法律责任。

欢迎大家对网站内容侵犯版权等不合法和不健康行为进行监督和举报。 沪ICP备15014499号-2