为什么我的回掉函数用不了?
move.js
function getStyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle[attr]; }else{ return getComputedStyle(obj,false)[attr]; } } function starMove(obj,attr,iTarget,fn){ clearInterval(obj.timer); obj.timer = setInterval(function(){ var icur = 0; if(attr == 'opacity'){ icur = Math.round(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); if(fn){ fn(); } }else{ if(attr == 'opacity'){ obj.style.filter = 'alpha(opacity:"+(icur+speed)+")'; obj.style.opacity = (icur+speed)/100; }else{ obj.style.width = icur + speed + 'px'; } } },30) }
html
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> *{ margin: 0; padding: 0; } ul{ margin-top: 20px; } ul,li{ list-style: none; } ul li{ width:200px; height: 100px; background: red; margin-bottom: 20px; filter:alpha('opacity':30); opacity: 0.3; border: 1px solid #ccc; } </style> <script type="text/javascript" src="js/move.js"></script> <script type="text/javascript"> window.onload = function(){ var Li = document.getElementById('li1'); Li.onmouseover = function(){ starMove(Li,'width',400,function(){ starMove(Li,'height',200); }); } } </script> </head> <body> <ul> <li id="li1"></li> </ul> </body> </html>
调用完一次之后无法调用第二次。