jQuery - Animate then hide

问题

In jQuery how can I animate an element then hide it?

jsFiddle

$(".btn-disapear").click(function () {
    var $this = $(this);
    $(this).closest(".panel").animate({
        opacity: 0
    }, 500).slideUp(400);
});

回答1:

Use jQuery's .animate() callback function.

$(".btn-disapear").click(function () {
    var $this = $(this);
    $(this).closest(".panel").animate({
        opacity: 0
    }, 500, function() {
        $(this).hide(); // applies display: none; to the element .panel
    });
});

回答2:

use the complete parameter of jquerys animate function

$(".btn-disapear").click(function () {
    var $this = $(this);
    $(this).closest(".panel").animate({
        opacity: 0
    }, 500, function(){
        $(this).hide(); //alt $(this).slideUp(400);
    });
});

hope this helped

来源：https://stackoverflow.com/questions/31696175/jquery-animate-then-hide