我需要将功能与各种动画同步...不幸的是 jQuery 仅对某个对象的动画进行排队。
jQuery 提供了添加回调的可能性,但我无法向它传递任何外部变量。
<小时/>这是一些代码!!! =)
var unicorn_actions = [...];
for( var i=0; i<unicorn_actions.length; i++){
var unicorn_action = unicorn_actions[i];
if(unicorn_action['type'] == 'movement'){
$('#unicorn').animate({...}, unicorn_action['time']);
}
else if(unicorn_action['type']=='action'){
$('#unicorn').animate({}, 0, function(){
// I NEED TO APPEND THE ACTION TO THE ANIMATION
perform_action(unicorn_action);
});
}
}
<小时/>
第一个问题
var unicorn_name = "George";
$(...).animate({'top':100,'left':100 }, 100, function(){
alert(unicorn_name);
})
这将返回unicorn_name undefined!
<小时/>第二个问题
如果我需要将回调附加到动画队列,我正在考虑执行以下操作
$(...).animate({'top':100,'left':100 }, 0, function(){
// my actions
})
这会扰乱动画......
<小时/>大家有什么想法吗? =)
最佳答案
这是您的代码版本,可修复您发布的所有问题:
var actions = [
{action:'movement', top:123, left:123, time:1000},
{action:'alert', content:'test'},
];
$(function(){
$.each(actions, function(i, action) {
switch(action.action) {
case 'movement':
$('#unicorn').animate({top:action.top, left:action.left}, action.time);
break;
case 'alert':
$('#unicorn').delay(50).queue(function(){ alert(action.content); });
break;
}
});
});
You can test it here ,这些更改中有一些修复:
关于javascript - 将回调添加到动画队列 - jQuery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3327772/