javascript实现的动态设置元素透明度代码实例
分类:实例代码
本章节分享一段代码实例,它实现了动态设置元素透明度的效果。
并且能够兼容当前主流的浏览器包括低版本的IE浏览器。
代码实例如下:
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.pipipi.net/" /> <title>前端教程网</title> <style> #antozne{ width:200px; height:100px; background:#191818; } </style> <script> window.onload=function(){ var odiv=document.getElementById("antozne"); var obt=document.getElementById("bt"); var alpha=50; obt.onclick=function(){ odiv.style.filter='alpha(opacity:'+alpha+')'; odiv.style.opacity=alpha/100; } } </script> </head> <body> <div id="antozne"></div> <input type="button" id="bt" value="查看效果"/> </body> </html>