如何解决如何降低CSS不透明度
| 我需要纯JavaScript函数来查找HTML元素的当前不透明度并将其降低10%。有没有有效的跨浏览器解决方案? 请不要使用像jQuery这样的JS框架(我有我的理由,所以不问为什么),谢谢。解决方法
带有IE版本
var style = document.getElementById(...).style;
if(browserIsIE) {
var regExpResult = /alpha\\(opacity\\s*=\\s*(\\d*)\\s*\\)/.exec(style.filter);
var opacity;
if(regExpResult && regExpResult.constructor == Array && regExpResult[1] && opacity = parseInt(regExpResult[1])) {
style.filter = \"alpha(opacity = \" + (opacity - 10) + \")\";
} else {
style.filter = \"alpha(opacity = 90)\";
}
} else {
style.opacity = style.opacity==\'\' ? 0.9 : parseFloat(style.opacity)-0.1;
}
, var style = document.getElementById(...).style;
style.opacity = style.opacity==\'\' ? 0.9 : parseFloat(style.opacity)-0.1;
我忘了,返回值可能需要手动强制为字符串。
, 到目前为止,我已经取得了进展。您可以测试或微调吗?
function normOpacity(num,ie) {
num = parseFloat(num);
if(num<0) return 0;
if(num>1 && !ie) return 1;
if(num>100 && ie) return 100;
return num;
}
function changeOpacity(obj,diff) {
if(!obj) return;
if(!obj.filters) {
var gcs = document.defaultView.getComputedStyle(obj,null);
var op = parseFloat(gcs.getPropertyValue(\"opacity\")) + diff;
return obj.style.opacity = normOpacity(op)+\"\";
}
if(!obj.style.zoom) obj.style.zoom = 1;
var op,al,dx = \"DXImageTransform.Microsoft.\";
try { al = obj.filters.item(dx+\"Alpha\"); } catch(e) {}
if(!al) try { al = obj.filters.item(\"Alpha\"); } catch(e) {}
if(!al) {
var op = normOpacity(100+100*diff,true);
return obj.style.filter+= \"progid:\"+dx+\"Alpha(opacity=\"+op+\")\";
}
try { op = al[\"Opacity\"]; } catch(e) { op = 100; }
al[\"Opacity\"] = normOpacity(parseInt(op)+100*diff,true)+\"\";
}
用法
changeOpacity(obj,-0.1); // opacity should be 10% lower,regardless the browser
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。