施用Javascript设置HTML元素的不透明度-HTML教程-爱易网页

施用Javascript设置HTML元素的不透明度

日期：2014-05-17　浏览次数：20732 次

使用Javascript设置HTML元素的不透明度

你一定见过的模糊效果的HTML元素，如表，DIV慢慢地使这些元素的不透明度为透明或不透明的。这可以通过JavaScript达到这个效果。

Internet Exlporer时称为过滤器支持CSS属性，其中你可以选择很多不同的滤波器选项，可以在浏览器中。目前有三种类型的过滤器“视觉过滤器和显示/混合转型过滤器。多个过滤器可以应用到一个选择器的应用顺序往往在最后的视觉效果发挥了重要作用，产生有趣的结果。当前过滤器只适用于在视觉范围内，但可以允许其他功能的可扩展性的属性。

因此，下面的代码可以用来设置不透明度的IE浏览器中的HTML元素。

var opacityValue = 0.5; //使50％不透明

myElement.style.filter = "alpha(opacity=" + opacityValue*100 + ")"; // IE

但上面的代码将无法与其他浏览器如Firefox，Opera等Firefox支持的另一个CSS属性元素的不透明度不透明度，控制

以下JavaScript函数将不透明度设置任何HTML元素，不论浏览器。

function setOpacity (myElement, opacityValue) {

if (window.ActiveXObject) {

myElement.style.filter = "alpha(opacity="

+ opacityValue*100 + ")"; // IE

} else {

myElement.style.opacity = opacityValue; // Gecko/Opera

}