12 May, 2010
jQuery AJAX Loading – Display Images or Text Until Script is Finished (Part 2)
Posted by: john In: jquery|php|programing|tutorial
This is a more practical way to display an image or text while an AJAX request is loading.
What we’re basically doing is forcing a DIV to have a starting image and then replacing it with the text return from the AJAX request.
function loadingAjax(div_id)
{
$("#"+div_id).html('
saving...');
$.ajax({
type: "POST",
url: "script.php",
data: "name=John&id=28",
success: function(msg){
$("#"+div_id).html(msg);
}
});
}
Usage
save page
As always – if you’re looking for a sweet AJAX loading image, check out www.ajaxload.info..
If you have any questions or *gasp* improvements, please leave me a comment below.
Similar Posts:
- Fade in and Out the Most Recent Pictures in a Directory with jQuery
- Rotate Images with jQuery and PHP
- jQuery Loading – Display Images or Text Until Script is Finished
- Run Javascript Code After an AJAX Request
- Text to Image Using PHP and img4me
September 7th, 2010 @ 6:21 am
Hi
This is really helpful tut. I need some modifications about which I want to know that how can I do it? I want that images load as page loads. For example you can see this here at http://www.classiccars.co.uk there is two rows below of images where you can see the cars. How can I load images like that.
Regards
September 10th, 2010 @ 1:11 pm
You could do something similar by replacing the image on a mouseover. First display the first image with something like this:
// then use jquery to replace the image for that id on a mouseover or click
November 23rd, 2010 @ 1:47 am
Thanks a lot. Surfing this from this morn.
Got it.. Thank u very much
July 2nd, 2011 @ 5:42 pm
hi john… thank’s you for your solution…
but i have a little problem…
what i use command if i wanna run this script after load not click
thx very much
July 6th, 2011 @ 4:48 pm
please use the contact form to email me. i’m not sure what you’re asking.