jquery queue problem

$(".menu-container开发者_开发知识库").animate({top:"25px"}); 
$(".menu-container").animate({top:"-900px"}); 
$(".windows-container").animate({top:"-730px"});

hello sir.. i got a problem on queue in jquery.. what i want to do is

$(".menu-container").animate({top:"25px"}); ----execute first then after this,

$(".menu-container").animate({top:"-900px"});          --this one and
$(".windows-container").animate({top:"-730px"});       --this one should execute at the same time.. 

i tried this but its not functioning..

$(".menu-container").queue(function(){
    $(".menu-container").animate({top:"25px"});
    $(".windows-container").animate({top:"-730px"});
    $(".menu-container").animate({top:"-900px"});
 });

---

---

You need to start each animation when the previous one finishes, like this:

$(".menu-container").animate({top:"25px"}, function() {
    $(".menu-container").animate({top:"-900px"}, function() {
        $(".windows-container").animate({top:"-730px"});
    }); 
}); 

---

animate has a callback function you can use to perform actions after an animation is complete

$('#clickme').click(function() {
  $('#book').animate({
    opacity: 0.25,
    left: '+=50',
    height: 'toggle'
  }, 5000, function() {
    // Animation complete.
  });
});