I have some elements pushed on the page via ajax. How can I make them disapear 3 seconds after their creation, for exemple with a fade-out effect ?
The html is pushed by an external jQuery library performing multiple upload ( http://blueimp.github.com/jQuery-File-Upload/ ). After a file is uploaded, the plugin pulls this on the page:
<div class="template-download fade">
FileName ...
Errors...
</div>
Use the plugin's callback functions. For instance:
$('#fileupload').bind('fileuploadalways', function (e, data) {
setTimeout(function(){$('div.template-download.fade').fadeOut()}, 3000);
});
...should trigger a fadeOut on the element 3000 milliseconds after your AJAX return, regardless of what the result was.
Callbacks are essential to any kind of AJAX functionality. Normally your code keeps on running as quickly as possible, without waiting for your AJAX function or method to return any data. The callback is only run after it returns a result, and specific callbacks can be called for specific results.
Other callbacks exist only for successful uploads, failed uploads, etc. Read https://github.com/blueimp/jQuery-File-Upload/wiki/Options and scroll down to "callback options."
$("div").html("example example").delay(3000).fadeOut();
this is why we are using jquery.
EDIT for @mblase75 comment,
$("div").load('ajax.html').delay(3000).fadeOut();
This should go
setTimeout(fadeout(),3000);
function fadeout(){
$("yourid").fadeOut();
}