Afterwhich, if you want to check if the image has been downloaded/
cached before displaying it you can use the Image.complete attribute
eg:
// timer
var loadImg = 0;
// create image, start caching image
var $img = $("<img/>").attr("src", "/img/yourimage.jpg");
if (!$img[0].complete) {
// show loading message
// $span.html('loading..');
checkLoad();
}
else {
showImage();
}
// checking loading state of image
function checkLoad() {
if (!$img[0].complete) {
loadImg = setTimeout(checkLoad, 50);
}
else {
clearTimeout(loadImg);
showImage();
}
}
On May 27, 10:41 pm, "Andy Matthews" <[EMAIL PROTECTED]> wrote:
> Josh...if I was checking server side I wouldn't even have posted. However,
> this is all client side so I need something for that end. Dan's suggestion
> works flawlessly.
>
> Thanks though.
>
> _____
>
> From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
> Behalf Of Josh Nathanson
> Sent: Tuesday, May 27, 2008 4:37 PM
> To: jquery-en@googlegroups.com
> Subject: [jQuery] Re: Display loading image while alternate image loads.
>
> Hi Andy,
>
> In regards to whether the file exists...I know you're using ColdFusion, is
> it possible to use the CF function FileExists in your CF code to determine
> if the jpg exists, and then maybe disable that option, or not show it at
> all? That way it would degrade gracefully.
>
> -- Josh
>
> ----- Original Message -----
> From: Dan G. <mailto:[EMAIL PROTECTED]> Switzer, II
> To: jquery-en@googlegroups.com
> Sent: Tuesday, May 27, 2008 1:56 PM
> Subject: [jQuery] Re: Display loading image while alternate image loads.
>
> Andy,
>
> You can use the onerror event of an image to determine if an image loaded or
> not. Also, you could load the image using JS's Image object-that way you
> could display a "loading" image. Here's some example code:
>
> http://www.rgagnon.com/jsdetails/js-0083.html
>
> -Dan
>
> _____
>
> From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
> Behalf Of Andy Matthews
> Sent: Tuesday, May 27, 2008 4:50 PM
> To: [jQuery]
> Subject: [jQuery] Display loading image while alternate image loads.
>
> I have a default image loaded into an img tag with an id of "specialImage".
> I also have a select box which displays a list of vehicles. The value of
> each option is a filename (75682.jpg, 75123.jpg, etc.).
>
> When the user selects a vehicle, I want to change the src of the img tag but
> I'm running into a few issues that I'm not sure how to get around.
>
> 1) Because I'm not using an AJAX call, I don't know if the file actually
> exists on the server. A few images are then showing as broken which is a big
> no no.
>
> 2) The images being loaded in aren't huge, but they might be 40k or so.
> Because I'm simply changing the src, I can't display a loading image while
> the requested image is loading.
>
> Are there ways around this? I'm thinking I could do an AJAX call to get the
> response headers for the file. When I trigger the AJAX call, I'd display the
> loading image. Then, if the response comes back 200, then I can display the
> actual file, if not, I can display a "no image available" image.
>
> Any thoughts on this method? Is there a better way to do this?
>
> ____________________________________
>
> Andy Matthews
> Senior ColdFusion Developer
>
> Office: 615.627.9747
> Fax: 615.467.6249
>
> www.dealerskins.com<http://www.dealerskins.com/>
>
> Total customer satisfaction is my number 1 priority! If you are not
> completely satisfied with the service I have provided, please let me know
> right away so I can correct the problem, or notify my manager Aaron West at
> [EMAIL PROTECTED]
>
>
>
> image001.jpg
> 17KViewDownload
