让jquery在执行下一个动作之前等待

Question

我有这个小提琴。

悬停：第二个div必须向下滑动，然后第三个div。

当悬停丢失时：第三格必须向上滑动，然后第二格。

我该怎么办？

http://jsfiddle.net/sExNS/6/

$(document).ready(function(){ 
    $(".signincontainer").hover(function(){ 
     $(".myprofile").slideToggle(function(){ 
     $(".logout").slideToggle(); 
     }); 
    }); 
}); 

Answer 1

可以使用回调函数，这样的。

$(document).ready(function(){ 
    $(".signincontainer").hover(function(){ 
    $(".myprofile").slideToggle(function(){ 
     $(".logout").slideToggle();}); 
    }); 
}); 

检查出Fiddle

当鼠标离开，做这样this

$(document).ready(function(){ 
    $(".signincontainer").hover(function(){ 
     $(".myprofile").slideDown(function(){$(".logout").slideDown();}); 
    }, function(){ 
     $(".logout").slideUp(function(){$(".myprofile").slideUp();}); 
    }); 
}); 

Answer 2

试试这个

$(".myprofile").slideToggle(function() { 
    $(".logout").slideToggle(); 
}); 

DEMO

UPDATE

$('.signincontainer').hover(function() { 
    $(".myprofile").slideToggle(function() { 
     $(".logout").slideToggle(); 
    }) 
}, function() { 
    $(".logout").slideToggle(function() { 
     $(".myprofile").slideToggle(); 
    }); 
}); 

DEMO

Answer 3

$(document).ready(function(){ 
     $(".signincontainer").hover(function(){// work at mouse enter 
      $(".myprofile").slideToggle(function(){ 
      $(".logout").slideToggle(); 
      }); 
     },function(){ 
      $(".logout").slideToggle(function(){// work at mouse out 
      $(".myprofile").slideToggle(); 
      }); 
}); 
    }); 

见Demo

参考slideToggle，hover

Answer 4

尝试这样的事情如果你想正确的顺序，FIDDLE

$(document).ready(function() { 
    $(".signincontainer").hover(
     function() { 
      $(".myprofile").slideToggle(function() { 
      $(".logout").slideToggle(); 
     }); 
     }, function() { 
      $(".logout").slideToggle(function() { 
      $(".myprofile").slideToggle(); 
      }); 
     } 
    ); 

});