var lis=document.querySelectorAll('#all-panels li');
for(var i=0;len=lis.length,i<len;i++){
lis[i].timer=null;
lis[i].onmouseover=function(){
startMove3(this,{'width':400,'opacity':100},function(){
console.log(this);
startMove3.call(this,{'height':100,'font-size':18})
});
}
lis[i].onmouseout=function(){
startMove3(this,{'width':100,'opacity':30},function(){
startMove3(lis[i],{'height':50,'font-size':12})
});
}
}
function startMove3(obj,params,fn ){
clearInterval(obj.timer);
var flag = true;//所有动画都达到目标值
obj.timer=setInterval(function(){
for(var attr in params){
var cur=0;
if(attr == 'opacity'){
cur = Math.round(getObjStyle(obj,attr)*100);
}else{
cur = parseInt(getObjStyle(obj,attr));
}
var speed= (params[attr]- cur)/10;
speed = speed>0 ?Math.ceil(speed) : Math.floor(speed);
if(cur != params[attr]){
flag= false;
}
if(attr=='opacity'){
obj.style[attr] = (cur + speed)/100;
}else{
obj.style[attr] = cur + speed +'px';
}
if(flag){
clearInterval(obj.timer);
if(fn){
fn();
}
}
}
},30);
}
function getObjStyle(obj,attr){
if(obj.currentStyle){
return obj.currentStyle[attr];
}else{
return getComputedStyle(obj,false)[attr];
}
}这种回调函数如何改变this的指向呢?我做了一个简单的,不是多物体的,就是把定义的对象传进去,那如果是多物体运动,如和改变回调函数的这个this的指向?请大神帮忙解决
添加回答
举报
0/150
提交
取消