链式运动的回调函数不执行
回调函数不执行是为什么啊
回调函数不执行是为什么啊
2016-12-10
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8"/>
<meta name="Generator" content="EditPlus®"/>
<meta name="Author" content=""/>
<meta name="Keywords" content=""/>
<meta name="Description" content=""/>
<title>Document</title>
<style type="text/css">
/* css默认样式重置 */
body,p,h1,h2,h3,ul,li{margin:0;padding:0;font-size:12px;}
ul{list-style:none;}
a{text-decoration:none;}
img{border:none;vertical-align:top;}
li{width:200px;height:100px;background:yellow;margin-bottom:20px;border:4px solid black;filter:alpha(opacity:30);opacity:0.3;}
</style>
<script type="text/javascript">
window.onload=function(){
var Li=document.getElementById("li1");
Li.onmouseover=function(){
startMove(Li,"width",400,function(){
startMove(Li,"height",200,function(){
startMove(Li,"opacity",100);});
});
}
Li.onmouseout=function(){
startMove(Li,"opacity",30,function(){
startMove(Li,"height",100,function(){
startMove(Li,"width",200);});
});
}
function startMove(obj,att,iTarget,fn){
clearInterval(obj.timer);
obj.timer=setInterval(function(){
var icur=0;
if(att=="opacity"){
icur=Math.round(parseFloat(getStyle(obj,att))*100);
}else{
icur=parseInt(getStyle(obj,att));
}
var speed=(iTarget-icur)/8;
speed=speed>0?Math.ceil(speed):Math.floor(speed);
if(obj.icur==iTarget){
clearInterval(obj.timer);
fn && fn();//回调函数
}else{
if(att=="opacity"){
obj.style.filter="alpha(opacity:"+(icur+speed)+")";
obj.style.opacity=(icur+speed)/100;
}else{
obj.style[att]=icur+speed+"px";}
}
},30);
}
function getStyle(obj, attr){
return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr];
}
}
</script>
</head>
<body>
<ul>
<li id="li1"></li>
</ul>
</body>
</html>
举报