如何在第二次点击时使这个jQuery动画反向/切换/向后翻转？

Question

现在我有了这个

<script type='text/javascript'>

        $("#beau").click(function(){
        $("#beau").animate({"margin-Top": "738px"}, "fast");
        });

        </script>

并且可以通过更改“margin-Top”来降低div，但我想要做的是当用户再次点击它时，它会回到700px的“margin-Top”并重复它一遍又一遍。我认为这很简单，但我只是做了大约5天的jQuery :)所以如果我知道的话。但如果你理解我的问题，谢谢你的答复：）。

Answer 1

您可以使用.toggle()：

$("#beau").toggle(function(){
    $(this).stop().animate({marginTop: 738}, "fast");
}, function() {
    $(this).stop().animate({marginTop: 700}, "fast");
});

我添加了一个stop()，只是为了确保在快速点击多次后不会破坏动画周期。