Promise()

Usage of the promise() to wait the end of the animation to start the callback, not the end of the START of the animation

by AndreaLigios

HTML

<html>
<body>

    <a href="#" class="link1">Link 1</a>
    <a href="#" class="link2">Link 2</a>
    
    <div class="div1">I'm div1</div>
    <div class="div2">I'm div2</div>
    
    
</body>
</html>

JavaScript

$(function () {
    $(".div1, .div2").hide();

    $(".link1, .link2").bind("click", function () {
      var e = $(this);
        $(".div1, .div2").fadeOut().promise().done(function() {
          if (e.attr("class") == "link1"){
              $(".div1").fadeIn();
          } else { 
              $(".div2").fadeIn();
          }
        });        
    });
});