jQuery animation to show the flow of slidedown, show and fade out
I would like to ask how is it possible for me to create a animation flow to show an update status, which will be animated through the flow of:
- Form updated successfully
- SlideDown to display the success status message within a div
- Show this message for 5 seconds
- Fade out the message after 5 seconds is up
This is what I have so far...
$("#status").empty().append("successfully updated." );
$('#status').slideDown('fast', function() {
$("#status").show(5000, 开发者_Go百科function() {
$("#status").fadeOut('slow');
});
});
Thank you very much.
Here's one way: HTML:
<form ...></form>
<div id="message" style="display:none;">Update successfull</div>
Javascript:
$('#message').slideDown().delay(5000).fadeOut();
EDIT Modifying the code you just added, you should do it like this:
$("#status").empty().append("successfully updated." );
$('#status').slideDown('fast', function() {
setTimeout(function(){
$("#status").fadeOut('slow');
}, 5000);
});
Hope this helps. Cheers
$("#myDiv").text("update successfull").slideDown().fadeOut(5000);
精彩评论