Sagewire Logo

Question, need expert help pre-loading images properly (IE + FireFox), thank you :)

11 Message(s) by 7 Author(s) originally posted in javascript programming


From: SaraLeePerson Date:   Thursday, October 25, 2007
Dear group,

I am seeking a easy to maintain and more importantly *working* way to
pre-fetch image s, so the pages I develop load smoothly without seeing
the images kick in flicker as they usually do. Important - I need
this to work on Internet Explorer 6.0+ and FireFox.

I am presently using at the head of the page,

pic100= new Image;
pic100.src="./imageme.gif";

However, it does not seem to work on FireFox at all. I have tried
different combinations with the URL path, but I do not know what I am
doing wrong. Can someone please assist me with this boggle?

Thank you very much in advance for any assistance.:)

Best wishes, Sara.


From: Stevo Date:   Thursday, October 25, 2007
wrote in message:
pic100= new Image;
pic100.src="./imageme.gif";
However, it does not seem to work on FireFox at all. I have tried
Thank you very much in advance for any assistance.:)



I could be wrong and using new Image; is just fine, but I have always used
new Image();

You did not mention how you use pic100 so that's all there is to go on.


From: SaraLeePerson Date:   Thursday, October 25, 2007
I could be wrong and using new Image; is just fine, but I have always used
new Image();
You did not mention how you use pic100 so that's all there is to go on.



Hi :-)

Presently, the configuration for FireFox and IE I have is

<script>
pic100= new Image;
pic100.src="./imageme.gif";
</script>

<img src=./imageme.gif>


From: Thomas PointedEars Lahn Date:   Thursday, October 25, 2007
wrote in message:
I am seeking a easy to maintain and more importantly *working* way to
pre-fetch images, so the pages I develop load smoothly without seeing
the images kick in flicker as they usually do.



Please do not.

Thank you very much in advance for any assistance.:)



You're welcome.F'up2 cljs

PointedEars
--
var bug RiddenCrashPronePieceOfJunk = (
navigator.userAgent.indexOf('MSIE 5') != -1
&& navigator.userAgent.indexOf('Mac') != -1
) // Plone, register_function.js:16


From: SaraLeePerson Date:   Thursday, October 25, 2007
Please do not.
> Thank you very much in advance for any assistance.:)
You're welcome.
F'up2 cljs



What?


From: Stevo Date:   Thursday, October 25, 2007
wrote in message:
<script>
pic100= new Image;
pic100.src="./imageme.gif";
</script>
<img src=./imageme.gif>



OK, you're expectations are too high. That pic100.src *is* starting to
preload the file, but your img tag is going to start using it long
before it'll be finished loading. What people usually do in cases like
this is to set the img src to a blank image, and only when pic100.src
has finished loading, do you then change the src of the img to point to
it. If you google "preload images JAVAscript" you will find lots of
ready-code d examples.


From: David Mark Date:   Thursday, October 25, 2007
wrote in message:
> Please do not.
> > Thank you very much in advance for any assistance.:)
> You're welcome.
> F'up2 cljs
What?



Follow up to comp.lang.JAVAscript.

As for the original question, if these images are displayed initially
without user interaction, then trying to preload them is a waste of
time. The page will continue to render, regardless of whether the
images have finished loading. This is a good thing.

I do not know what you mean by "flicker", but if your layout twitches
during load, you likely forgot the height/width attributes on the
images.

Or perhaps they are interlaced GIF's and you do not like that effect.
If so, make them non-interlaced.

If it is the placeholders that bug you and these images are just
decorations, use CSS to make them backgrounds.


From: Peter Michaux Date:   Thursday, October 25, 2007
wrote in message:
Dear group,
I am seeking a easy to maintain and more importantly *working* way to
pre-fetch images, so the pages I develop load smoothly without seeing
the images kick in flicker as they usually do. Important - I need
this to work on Internet Explorer 6.0+ and FireFox.
I am presently using at the head of the page,
pic100= new Image;
pic100.src="./imageme.gif";



I'm rewriting some old preload code to try to reduce server
connections. For some reason, after the window.onload event, each use
of the following code

var img = new Image();
img.src = someUrl;

causes a new connection to the server (Apache ). Because many (~100)
images now need to be preloaded, this is causing Apache grief. (I
did not write the specs on this page. It is legacy and needs a quick
fix until I have time for a real solution.)

If the same many images are just written into the page with <img
src="someUrl">
the same initial connection is being used to get all
images. I believe this is Apache's pipelining feature at work to
conserve connections.

Does anyone know about this situation and is their a standard
solution?

I have a few ideas to try when the server admin is available but I
thought I'd ask since the topic has appeared.

Thanks,
Peter


From: SAM Date:   Saturday, October 27, 2007
Peter Michaux a écrit :
I'm rewriting some old preload code to try to reduce server
connections. For some reason, after the window.onload event, each use
of the following code
var img = new Image();
img.src = someUrl;
causes a new connection to the server (Apache). Because many (~100)
images now need to be preloaded, this is causing Apache grief.



And post-writing css rules (or post-writing a call to a *.css) for this
100 images as backrground of the same transparent image opened in the page ?
(probably they won't appear in order)

--
SM


From: Bone Ur Date:   Sunday, October 28, 2007
wrote in message:

I am seeking a easy to maintain and more importantly *working* way to
pre-fetch images, so the pages I develop load smoothly without seeing
the images kick in flicker as they usually do. Important - I need
this to work on Internet Explorer 6.0+ and FireFox.

I am presently using at the head of the page,

pic100= new Image;
pic100.src="./imageme.gif";
I'm rewriting some old preload code to try to reduce server
connections. For some reason, after the window.onload event, each use
of the following code
var img = new Image();
img.src = someUrl;
causes a new connection to the server (Apache). Because many (~100)
images now need to be preloaded, this is causing Apache grief. (I
did not write the specs on this page. It is legacy and needs a quick
fix until I have time for a real solution.)
If the same many images are just written into the page with <img
src="someUrl">
the same initial connection is being used to get all
images. I believe this is Apache's pipelining feature at work to
conserve connections.
Does anyone know about this situation and is their a standard
solution?
I have a few ideas to try when the server admin is available but I
thought I'd ask since the topic has appeared.



You can j/s preload sequentially: ie, not starting the following preload
until the previous is finished. I have done that and it works. But a
better idea (I think) is just to make a position:absolute;
visibility:hidden; div "layer" encompassing all the images which won't
show because of the css.

--
Bone Ur
Cavemen have stronger pheromones.


From: David Mark Date:   Sunday, October 28, 2007
wrote in message:
wrote in message:
I am seeking a easy to maintain and more importantly *working* way to
pre-fetch images, so the pages I develop load smoothly without seeing
the images kick in flicker as they usually do. Important - I need
this to work on Internet Explorer 6.0+ and FireFox.
I am presently using at the head of the page,
pic100= new Image;
pic100.src="./imageme.gif";
> I'm rewriting some old preload code to try to reduce server
> connections. For some reason, after the window.onload event, each use
> of the following code
> var img = new Image();
> img.src = someUrl;
> causes a new connection to the server (Apache). Because many (~100)
> images now need to be preloaded, this is causing Apache grief. (I
> did not write the specs on this page. It is legacy and needs a quick
> fix until I have time for a real solution.)
> If the same many images are just written into the page with <img
>
src="someUrl"> the same initial connection is being used to get all
> images. I believe this is Apache's pipelining feature at work to
> conserve connections.
> Does anyone know about this situation and is their a standard
> solution?
> I have a few ideas to try when the server admin is available but I
> thought I'd ask since the topic has appeared.
You can j/s preload sequentially: ie, not starting the following preload
until the previous is finished. I have done that and it works. But a
better idea (I think) is just to make a position:absolute;
visibility:hidden; div "layer" encompassing all the images which won't
show because of the css.



That will mess up the semantics of the page and will look strange when
style is disabled. For the scriptless approach, it is better to use
background images.



Next Message: Clarifying scope of literals


Blogs related to Question, need expert help pre-loading images properly (IE + FireFox), thank you :)

From 1 July 2007, the Better Super changes will give the ...
convertible nissan z. praxis 1 test questions carrier diversity oriely java swing documentation simple capacitor 92 51 113 52 54 ugly nude people rose colors pb ministeries bpr vs iso cadmus gay trailblazer motherboards mindspring so ...

James Oddo is a good fella
[12:07] (lysandy) I need help [12:07] (lysandy) please help me [12:07] (FreeTrade) When I had my own kids I pledged to myself i would no longer help other kids as either a foster parent or a drug and alcohol counselor. ...

I have a imagemagick div bunch of text another div floated left ...
kristin, that doesn’t work right because the left and right are different colors and it needs to fill the screen horizontally. The only way to do that your way is to make ridiculously huge backgrund images. ...

Software Testing preparation in One Day for Interview
There is no single answer for this question.If we have all the project files then we need to setup the site, by using Virtual Directories and all, there u can a link like http://localhost/VirtualDirectoryName/PageNames. ...

A History of the Social Web
As an English-speaking person, it's up to you to learn how to speak English properly and make whatever use you please of it...” TCP/IP offered such a common standard (not unlike the English language) that would allow different networks ...

25 new messages in 19 topics - digest
budget periods will fall in the same month - it's a bit convoluted > though :P > * If you are in fact creating the budget fenceposts as you go along, you > don't need to generate all 12.. just generate till you find the one you ...


Programming | Sports | Autos

copyright 2006
Valid XHTML 1.0 Transitional