animate chaining isn't working
When I click the background image, f1 gets called and executes as expected, but f2 doesn't get called after the animation in f1. What am I missing?
-
Drupal.behaviors.director = function(context) {
$("#background").mousemove(function(ev) {
var x = ev.pageX;
var y = ev.pageY;
$("#coordinates").html(x + " - " + y);
});
$("#background").click(function() {
$("#background").animate({marginLeft: "0px"}, 0, function(){f1();});
});
function f1() {
$("#Master_says").html("");
$("#WeedWhacker_says").html("");
$("#Master_says").html("Ooooommmmm...");
$("#background").animate({marginLeft: "0px"}, 1000, function(){f2();});
}
function f2() {
$("#WeedWhacker").animate({marginLeft: "80px"}, 1000, function(){f3();});
}
}
[/code]