...

View Full Version : Don't display an image until is completely downloaded



joshua7
08-27-2008, 08:47 AM
In my site when you add a very large image to a post and then you see that post, the image downloads in its actual size and then resizes to the size I allow.

I've noticed in a website that large images aren't displayed until they load completely. So if the image is huge you don't see a thing until it is completely downloaded.

Is this possible to accomplish with javascript?

Philip M
08-27-2008, 09:05 AM
Pre-load the image, then display it.

rhinodog8
08-27-2008, 09:44 AM
you could have the style set to none and onload have the display set to block

display being a css property.

lipsigprice
08-27-2008, 02:40 PM
display Image after Pre-load the image

joshua7
08-27-2008, 06:41 PM
you could have the style set to none and onload have the display set to block

display being a css property.

do I have to specify image sources this way?
Because images are supposed to be uploaded randomly by the community.

Cranford
08-27-2008, 07:18 PM
I'd avoid the problem altogether. Don't use JavaScript to re-size images. Use your server language. If your host supports PHP, then post an appropriate question in that forum. PHP has some excellent image manipulation functions that will maintain the aspect ratio, color density, etc. You can manipulate the image as soon as it's uploaded. You can create a temporary page, for your use only, to re-size all existing images. This way, all images load in a reasonable amount of time.

joshua7
08-27-2008, 09:27 PM
Ok I understand. Uploaded images shouldn't be a problem this way.
What can I do about images posted through bb code?

Cranford
08-27-2008, 09:37 PM
You've posted twice now, and still can't bring yourself to write "thank you" in response to ANYONE who took the time to help you. I'm finished.

rhinodog8
08-27-2008, 09:44 PM
do I have to specify image sources this way?
Because images are supposed to be uploaded randomly by the community.

No it would be a css class that would be automatically applied to any uploaded image.

joshua7
08-28-2008, 09:52 AM
I should change the class when the page loads right?
Something like:


<body onload="document.getElementById( ).className = 'showimages';">

.showimages img {
display: inline;
}

rhinodog8
08-28-2008, 11:02 AM
yea, expect you'd use:

onload="getElementByClass('imgclass').style = 'display: block'"
and i don't know for sure but I think you can use onload to images, and just have you server/php/forum/whatever have it insert that code in posts and inbetween <img></img> tags.

and have the img class be(in CSS)
.imgclass {display:none;}

rhinodog8
08-28-2008, 11:03 AM
Sorry, duplicate post, can't seem to delete it.

joshua7
08-28-2008, 06:23 PM
ok thanks so much rhinodog8!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum