How do I let a slideDown() animation continue, after I have previously stopped it (or slideUp()) midway? I believe the fact that it won't, has to do with the fact that slideDown() only acts on elements that are initially hidden. And elements in the midst of these animations are not hidden.
Is there a way to circumvent this behaviour, and have jQuery continue animating after being stopped? (Edit: or if you know of an alternative solution to using slideDown(); that will do as well of course)
Please view my jsfiddle example as well, to see what I'm trying to do.
As for a little background information:
I want to implement this behaviour for form validation messages. I individually slide them down, and after a delay, slide them up again. But if a user resubmits the form quicker than the messages disappear and certain "new" messages are already present and have not finished animating (either sliding up or down), I want to slide them down again.
Indicate whether the slideDown is completed in .data(). If it is not completed due to the stop function, hide it and slideDown again.
See DEMO.
$( 'div' ).hide().slideDown(1000, function() {
$(this).data("completed", "completed");
});
setTimeout( function() {
$( 'div' ).stop( true );
}, 500 );
setTimeout( function() {
if ($('div').data("completed") !== "completed") {
$( 'div' ).hide().slideDown();
}
}, 2000 );