位置: 编程技术 - 正文
js和jQuery设置Opacity半透明 兼容IE6(js设置option)
编辑：rootadmin推荐整理分享js和jQuery设置Opacity半透明 兼容IE6(js设置option)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:js怎么用jquery,jsoup jquery,jquery 设置,js设置option,jquery.js,jquery 设置,jquery 设置,jsoup jquery,内容如对您有帮助，希望把文章链接给更多的朋友！
1.css设置透明度
透明度在IE浏览器和其他相关浏览器中的设置方法是不一样的，IE使用滤镜filter的alpha属性，firefox和其它浏览器不支持滤镜，它们使用opactiy属性设置透明度，下面示例设置透明度为%：
IE：filter: alpha(opacity:)；firefox：opacity(0.3)；
2.使用js设置透明度
为了兼容IE与其他浏览器对透明度的设置，我们需要对以上两种样式分别进行设置。下面是一段示例代码：
3.jQuery设置透明度
jQuery中对透明度的设置进行了整合，兼容IE和其他浏览器，修改opactiy属性值即可，值为小数，因此只需要设置一次即可。下面是一段示例代码：
由此可见，使用jQuery进行透明度设置，大大减少了代码编写的难度，同时可以很好地保证不同浏览器的兼容性，但是使用jQuery需要导入jQuery的库文件，在某些场合会给站点的访问速度造成影响，如果要求不是太高，我们也可以直接使用js实现我们需要的效果，下面给出一段使用js实现半透明效果的完整示例代码。
4.应用实例
该实例使用原生js实现一个div的淡入淡出效果；鼠标移入div区域，透明度为%，鼠标移出div区域透明度为%，同时用时间控制透明度转换效果；
window的onload函数指定了在页面加载的时候需要执行的方法，document.getElementById实现通过元素的id得到元素对象，然后通过得到对象的onmouseover绑定了鼠标移到指定层上面时对应需要执行的函数，该实例执行startMove()，鼠标移出层通过onmouseout绑定对应的执行函数，该实例执行startMove()。
startMove函数实现的功能是将指定元素的透明度设置为传入参数iTarget，范围需要在0-之间，并使用setInterval启动了一个定时器实现动画效果。
总结：说到底就两个属性，一个是这对火狐，谷歌这类浏览器的属性opacity(0.3)直接设置一个小数即可，另一个针对IE的属性filter: alpha(opacity:)，都设置好即可，另外jQuery大大简化了相应的操作，如果网站上用到了jQuery的库，还是很推荐使用jQuery的方法的。
jquery html动态添加的元素绑定事件详解 在实际开发中会遇到要给动态生成的html元素绑定触发事件的情况：divid="testdiv"ul/ul/div假设我们要给ul动态添加的li绑定click事件形成如下结果divid="testdiv"u
Jquery元素追加和删除的实现方法 介绍DOM是DocumentObjectModeule的缩写，一般来说，DOM操作分成3个方面。1、DOMCoreDOMCore并不专属于javascript，任何一种支持DOM的程序设计语言都可以使用它，用
深入理解jquery中的事件与动画 1.鼠标事件eg：光棒效果$(function(){$('li').mouseover(function(){//鼠标移过时$(this).css('background','blue');}).mouseout(function(){//鼠标移过后$(this).css('background','');});});2.
标签: js设置option
本文链接地址:https://www.jiuchutong.com/biancheng/387247.html 转载请保留说明！