<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>任意属性值2</title> <style> *{margin: 0;padding: 0;} ul,li{ list-style: none; } ul li{ width: 200px; height:100px; background: yellow; margin-bottom: 20px; border:4px solid #000; opacity: 0.3; filter: alpha(opacity:30); } </style> <script> window.onload=function () { var lia = document.getElementById('li1'); lia.onmouseover=function () { startMove(this,'opacity',100); } lia.onmouseout=function () { startMove(this,'opacity',30); } } function getStyle (obj,attr) { if (obj.currentStyle) { return obj.currentStyle[attr]; } else { return getComputedStyle(obj,false)[attr]; } } var alpha=30; function startMove(obj,attr,itarget) { clearInterval(obj.timer); obj.timer = setInterval(function () { var icur = 0; if (attr == 'opacity') { icur = parseFloat(getStyle(obj,attr))*100; } else { icur = parseInt(getStyle(obj,attr)); } var speed = (itarget-icur)/8; speed = speed>0?Math.ceil(speed):Math.floor(speed); if (icur==itarget) { clearInterval(obj.timer) } else { if (attr=='opacicy') { // obj.style.filter='alpha(opacity:'+(icur+speed)+')'; obj.style.opacity=(icur+speed)/100; } else { obj.style[attr]=icur+speed+"px"; } } }, 30) } </script> </head> <body> <ul> <li id ='li1'></li> </ul> </body> </html>
这段代码怎么对透明度不起作用呢?求大神指导~谢谢~
harx
相关分类