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

对于无限动画循环，您可以使用：

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

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

Answer 3

可能您正在寻找slideUp()功能。无论如何，你的代码工作正常：

代码：http://jsfiddle.net/nbnV6/1/

在jquery中完成/完成另一个动画时启动动画

3 个答案: