473,699 Members | 2,226 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

preload image does't with non cached images

Here is a litle script that preload images and show a thumbnail. Once
you get on the picture you see the real size

It worsk fine with normal picture but when the url has some parameters
like in the sample. The image is loaded again every time I go over the
thumbnail.
Is there a solution for havint just one load?
function AddImage(url) {
document.write( "<a href=\"javascri pt:;\"
onMouseOver=\"d ocument.myImg.s rc='" + url + "';\"><img src=\"" + url +
"\" width=\"80\" height=\"80\" border=\"1\"></a>");
}

that i call like this

AddImage('http://www.wettercam24 .ch/cgi-local/archiv/eggishorn/webcam.cgi?func =bild');</script>
Jul 20 '05 #1
11 2507
Michel hu kiteb:
Here is a litle script that preload images and show a thumbnail. Once
you get on the picture you see the real size

It worsk fine with normal picture but when the url has some parameters
like in the sample. The image is loaded again every time I go over the
thumbnail.
Is there a solution for havint just one load?


Isnt the whole point of a thumbnail that it is a small (in byte count,
not screen size) file? Your script defeats the point of such thumbnails.
Id hate to see the download time when you have several 'thumbnails' on
one page.

--
--
Fabian
Visit my website often and for long periods!
http://www.lajzar.co.uk

Jul 20 '05 #2
You're right but I only have the large images. The only things I'm
looking for is not to have to download the image twice.
The idea is to see all the pictures in the thumbnail and be able to
enlarge one to see the details without having to wait for the loading.
*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!
Jul 20 '05 #3
michel reynard wrote:
You're right but I only have the large images. The only things I'm
looking for is not to have to download the image twice.
The idea is to see all the pictures in the thumbnail and be able to
enlarge one to see the details without having to wait for the loading.


Then you're probably looking to pre-load the images. On the page that
loads *small* thumbnails, add the following code:

<script type="text/javascript">
var imageCacher = new Image();
var myImages = [ 'image1.jpg', 'image2.jpg', 'image3.jpg' ... ];
for (var i = 0; i < myImages.length ; i++) {
imageCacher.src = myImages[i];
}
</script>

Now, as your *small* thumbnails load, the browser will be getting and
caching (subject to the rules of the server, any proxies and the browser's
own cache settings) each image you want. When the user clicks a thumbnail,
the image *may* already be loaded. If not, you've lost nothing because you
downloaded *small* thumbnails, if it is cached, it will appear almost
instantly.

It seems that you want to thumbnail all your large images in case the user
decides to click any single one of them. This seems like a really bad
idea. I don't want to wait for 1MB of images to download so I can enlarge
one more quickly.

--
| Grant Wagner <gw*****@agrico reunited.com>

* Client-side Javascript and Netscape 4 DOM Reference available at:
*
http://devedge.netscape.com/library/...ce/frames.html

* Internet Explorer DOM Reference available at:
*
http://msdn.microsoft.com/workshop/a...ence_entry.asp

* Netscape 6/7 DOM Reference available at:
* http://www.mozilla.org/docs/dom/domref/
* Tips for upgrading JavaScript for Netscape 7 / Mozilla
* http://www.mozilla.org/docs/web-deve...upgrade_2.html
Jul 20 '05 #4
michel reynard hu kiteb:
You're right but I only have the large images.
So make them. Even windows paintbrush has the ability to make thumbnail
size images from the original large file. Resources is not an excuse for
not having separate thumbnail files.
The only things I'm
looking for is not to have to download the image twice.
As opposed to downloading all of them at once, wasting download time for
those who dont wat to see all of them.

Suppose you have 30 humbnails, and lets suppose each file is 60k. Thats
1.8 meg already. Now suppose you make thumbnails, each 5k in size. Thats
150k, a far more palatable download time.
The idea is to see all the pictures in the thumbnail and be able to
enlarge one to see the details without having to wait for the loading.

May I suggest a loop that preloads the large images, while teh main file
only displays the smaller thumbnails?
--
--
Fabian
Visit my website often and for long periods!
http://www.lajzar.co.uk

Jul 20 '05 #5
@SM
Michel a ecrit :
Here is a litle script that preload images and show a thumbnail. Once
you get on the picture you see the real size
Because you call that a pre-loading ? ? ?
It worsk fine with normal picture but when the url has some parameters
like in the sample. The image is loaded again every time I go over the
thumbnail.
Is there a solution for havint just one load?
Use thumbnails as they have to do ==>
- thumbnail == small image.
- thumbnail != same big image
function AddImage(url) {
document.write( "<a href=\"javascri pt:;\"
onMouseOver=\"d ocument.myImg.s rc='" + url + "';\"><img src=\"" + url +
"\" width=\"80\" height=\"80\" border=\"1\"></a>");
}

that i call like this

AddImage('http://www.wettercam24 .ch/cgi-local/archiv/eggishorn/webcam.cgi?func =bild');</script>


On wich page this script will run ?
that I know where to not go ! ! ;-((

--
*************** *************** *************** *************** **
Stéphane MORIAUX : mailto:st****** *************** @wanadoo.fr
Aide aux Pages Perso (images & couleurs, formulaire, CHP, JS)
http://perso.wanadoo.fr/stephanePOINTmoriaux/internet/
*************** *************** *************** *************** **
Jul 20 '05 #6
ok one more time what I'd like to do is to preload the large images
since they come from webcams or other sources on the web and there are
no small images.
Furthermore this page is for my own use and since I enlarge all pictures
I don't need small images...

ok now has somebody a solution for the problem?
if I do
imageCacher = new Image();
imageCacher.src = "myImage.jp g";
and then on the onMouseOver i do the
myImg.scr = imageCacher.src ;
It works fine with standard images but it doesn't if I have an image
created by a cgi called with one parameter like this one

http://www.wettercam24.ch/cgi-local/...m.cgi?func=bil
d

The cache mechanism must be overide since I'm calling a cgi with a
parameter.
Is there possible to copy the whole image instead of the adress?
Or does anybody have any other idea.

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!
Jul 20 '05 #7
michel reynard hu kiteb:
The cache mechanism must be overide


Overiding cache and preloading anything are mutually opposites as I
understand the terms. I expect they are opposites as the industry
defines the terms too.
--
--
Fabian
Visit my website often and for long periods!
http://www.lajzar.co.uk

Jul 20 '05 #8
@SM
michel reynard a ecrit :
ok one more time what I'd like to do is to preload the large images
this page is for my own use and since I enlarge all pictures
I don't need small images...

ok now has somebody a solution for the problem?
if I do
imageCacher = new Image();
imageCacher.src = "myImage.jp g";
and then on the onMouseOver i do the
myImg.scr = imageCacher.src ;
It works fine with standard images but it doesn't if I have an image
created by a cgi called with one parameter like this one

http://www.wettercam24.ch/cgi-local/...m.cgi?func=bil
d

As I know anything about cgi ...
This code seemd to be correct

for the pre-declaration of images's path ==>

I = new Array();

if(document.ima ges) {

// -- image to display in big view image ---
I[0] = new Image(); I[0].src = "http://server/site/folder/plein.gif";

// -- the other images to show in thumbnail ---
I[1] = new Image();
I[1].src =
"http://www.wettercam24 .ch/cgi-local/archiv/eggishorn/webcam.cgi?func =bild";
}
You can try to reslove your problen like that :
you call the src of image allready opened and displayed ==>

for(i=1;i<I.len gth;i++)
foo='<p><a href="javascrip t:void();" onMouseOver="do cument.myImg.sr c='+
'document.Pict' +i+'.src;"><img src="' + I[i].src +
'" width="80" height="80" border="0" name="Pict'+i+' "></a>';
foo += '<p><img src="'+I[0].src+'" width="'+larg+
'" height="'+haut+ '" name="myImg" border="1">';
document.write( foo);

The cache mechanism must be overide since I'm calling a cgi with a
parameter.


if you call the image allready shown in thumbnail size,
instead calling its url-cgi,
I hope the navigator will be abble to find it in its cache ... ?

See a demo here :
http://perso.wanadoo.fr/stephane.mor...uc/add_img.htm

--
*************** *************** *************** *************** **
Stéphane MORIAUX : mailto:st****** *************** @wanadoo.fr
Aide aux Pages Perso (images & couleurs, formulaire, CHP, JS)
http://perso.wanadoo.fr/stephanePOIN...iaux/internet/
*************** *************** *************** *************** **
Jul 20 '05 #9
Thank you but there is still the same problem.
If the image is like this one
http://www.wettercam24.ch/cgi-local/....cgi?func=bild
the image is reloaded each time you get on the picture with your mouse.
What I'm looking for is to copy the image and not just the url.
Jul 20 '05 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

3
3154
by: Perttu Pulkkinen | last post by:
I use database to store images. So img-tags are like <img src="viewer.php?img_id=100"> Can I use javascript/php-combination to preload images of whole site after first page is loaded? Or does all the images get loaded again automatically if they have dynamic urls? If so, can that behaviour be changed? This is the typical jscript i guess: //-------------------------
2
4038
by: Wonko | last post by:
Here's my problem if anyone could be so kind to help me out. I assume it's quite easy for an experienced programmer but I'm not one of them :) I have a JavaScript code that: - displays multiple images (+40) in a single image placeholder on ONE page - pre-loads multiple images - on a click of a mouse changes to the next image - on a click of a mouse changes to the previous image
7
3655
by: MALdito | last post by:
hi everybody let me say right from the start .. I´m not a coder ... "just" a designer! that said .. here is my question: I´m using dreamweaver´s built in preloader for a menu. it looks like this: function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length;
1
1918
by: Harod Ruthgar | last post by:
var image = new Image(); image.src="pathToTheFile"; The above code is called 25 times (with different pathToTheFile) within a loop. I manually checked the cache directory and not all images are cached, sometimes it's only 3, sometimes 4, etc, and mostly only the last few images within the loop.
2
2960
by: jmhill | last post by:
Has anyone else had this issue? Basically, the preload of images for a rollover effect for the navigation is really really slow when using IE 6.0 but when i view the site using Netscape, it's fast like it should be(no lag!) My problem is that since 96% of users use IE, i need to figure a way to fix this. Below is the javascript currently being used. The arguments are passed in before the script is called. MM_preloadImages(
2
3383
by: Albert Spencil | last post by:
I have tried several preload scripts found here; plus, some of my own. The only thing that works is the unsophisticated loading of those tiny images. The download consist of 100+ images amounting to 50+mb; and, normally completes in less than 1 minute without preload (using DSL). The preload terminates after 6 or 7 images and seems to time-out in the middle of an image. A reload will download a few more, etc. I have used the <body...
4
2688
by: Jake | last post by:
Does cookieless session state (with the sessionid embedded into the url) interfere with the browser's retrieval of cached images from one session to the next? Does the sessionid embedded into the url effectively limit client-side image caching to the lifetime of the session? Thanks Jake
2
1370
by: CK | last post by:
Words to the wise, Henry <rcornford@raindrop.co.ukwrote: Sorry for the delay, was overly swamped and only managed to be able to free some time last week to work on this. Yes, that was the whole problem. Adding Cache-Control with max-age solved the problem. I tried to add a FileETag as well, but this does not seem to make any
0
8618
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
1
8916
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
8885
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
1
6534
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
5875
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
4376
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
4631
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
2
2348
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
2010
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.