位置:首页 > 软件操作教程 > 编程开发 > JavaScript > 问题详情

JavaScript 半透明显示

提问人:刘团圆发布时间:2020-11-27

■知识点

设计元素的不透明度实现方法:IE怪异模式支持filters滤镜集,DOM标准浏览器支持style.opacity属性。IE和DOM的取值的范围也不同:IE的filters属性值范围是0〜100,其中0表示完全透明,而100表示不透明;DOM标准的style.opacity属性值范围是0〜1,其中0表示完全透明,而1表示不透明。

■实例设计

为了兼容不同浏览器,可以把设置元素透明度的功能进行函数封装。

//设置元素的透明度

//参数:e表示要预设置的元素,n表示一个数值,取值范围为0〜100,如果省略,则默认值为100,即不透明显示元素

function setOpacity(e, n) { 

    var n = parseFloat(n);                  //把第2个参数转换为浮点数

    if (n && (n〉100) || !n) n=100;         //如果第2个参数大于100或者不存在,则设置为100

    if (n && (n<0)) n =0;                   //如果第2个参数存在且值小于0,则设置其为0

    if (e.filters){                         //兼容IE浏览器

        e.style.filter = "alpha(opacity=" + n + ")";

    } else{                             //兼容DOM标准

        e.style.opacity = n / 100;

    }

}

继续查找其他问题的答案?

相关视频回答
回复(0)

特邀嘉宾

软件开发工程师——刘团圆

软件开发专业科班出身,擅长软件开发课程培训。

向TA咨询

该嘉宾的QQ群

更多>>
返回顶部