Запустите анимацию, когда другой будет закончен / завершен в JQuery

Question

Это не работает для меня:

$(".button").click(function(){ 
    $("#start").animate({
        "opacity": ".3"
    }, "slow", function(){
        $("#start").animate({"height": "0"}, "fast");
    });
});

Я хочу div, чтобы оживить, и когда это будет сделано, оживить снова.

Не имеет значения, что я ищу в Google ... на всех блогах и форумах говорится, что это должен быть единственный способ сделать это.

Answer 1

Похоже, нам нужно увидеть ваш HTML. У меня отлично работает:

http://jsfiddle.net/LTHtb/

<div class="button">start</div>

<div id="start"></div>

<script>
$(".button").click(function(){ 
$("#start").animate({
"opacity": ".3"
}, "slow", function(){
$("#start").animate({"height": "0"}, "fast");
    });
});
</script>

CSS:

 #start{
 height:200px;
  width:200px;
  margin-top:20px; 
  background-color:#e1e1e1;
}

.button{
   padding:10px;
   background-color:#369; 
   cursor: pointer;
   width:200px;
}

Answer 2

Возможно, вы ищете функцию slideUp().В любом случае ваш код работает нормально:

Код: http://jsfiddle.net/nbnV6/1/

Answer 3

Для бесконечного цикла анимации вы можете использовать это:

function animate() { 
  $("#start").animate({opacity: .3}, "slow", 
    function () {
      $("#start").animate({height: 0}, "fast", animate);
    }
  );
}

$(".button").click(animate);