Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery slideUp().remove() doesn't seem to show the slideUp animation before remove occurs

I have this line of JavaScript and the behavior I am seeing is that the selectedLi instantly disappears without "sliding up". This is not the behavior that I expected.

What should I be doing so that the selectedLi slides up before it is removed?

selectedLi.slideUp("normal").remove();
like image 430
Eric Schoonover Avatar asked Nov 21 '08 06:11

Eric Schoonover


3 Answers

Might be able to fix it by putting the call to remove in a callback arg to slideUp?

e.g

selectedLi.slideUp("normal", function() { $(this).remove(); } );
like image 159
seanb Avatar answered Oct 15 '22 05:10

seanb


You need to be more explicit: rather than saying "this" (which I agree should work), you should do this:

$("#yourdiv").slideUp(1000, function() {
    $(this).remove();
});
like image 22
Blake Avatar answered Oct 15 '22 04:10

Blake


The simplest way is calling the "remove()" function inside slideUp as a parameter like others have said, as this example:

$("#yourdiv").slideUp("normal", function() {
    $(this).remove();
});

It is a must to call it inside the anonymous function() to prevent remove() to be executed before the slideUp has ended. Another equal way is to use the jQuery function "promise()". Better for those who like self-explanatory code, like me ;)

$("#yourdiv").slideUp("normal").promise().done(function() {
    $(this).remove();
});
like image 8
xaviqv Avatar answered Oct 15 '22 04:10

xaviqv