Routine basic pour préchargement d'images

Version imprimable

Bonjour,

J'ai développé un petit site web en xhtml Transitionnal1.0 avec MSVStudio5. Mon site possède au total une quinzaine de jpg, variant de 35 Ko à 180Ko.

L'hébergement est gratuit mais comme il se doit, l'hébergeur offre une faible bande passante.

Je souhaite au moins pouvoir précharger ces 15 images à l'avance, côté client, lors du chargement de l'index.html.

Après plusieurs recherches d'explications et de codes (qui semblaient très bien fonctionner), j'ai utilisé le simple code suivant:

1. Dans l'entête:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 <script language="javascript" type="text/javascript"> function load() { if (document.images) { this.length=load.arguments.length; for (var i=0;i<this.length;i++) { this[i+1]=new Image(); this[i+1].src=load.arguments[i]; } } } function preload() { // Cette fonction charge dans le cache toutes les images passées en paramètre var temp=new load( "images/mon_image1.jpg","images/mon_image2.jpg") } </script>
2. Pour l'appel:

Code:

<body onload="preload()">

J'ai testé ce code sur les dernières vesions GoogleChrome, IE et FireFox. Au chargement de l'index.html,
je m'attends à ce que ce soit plus long, mais le code ne fonctionnne pas.

Manque-t-il une instruction, ou un détail contextuel ?

Merci pour votre aide.

21/08/2013, 15h58
SpaceFrog

Code:

this[i+1].src=arguments[i];
22/08/2013, 01h54
carjo

D'accord merci.

J'ai tout retesté avec la correction, malheureusement ça donne le même résultat: aucune image ne se place en mémoire lors du chargement de l'index.html.

Que peut-il manquer à ce code ?

Merci

Bonjour,

Le préchargement fonctionne, mais il s'exécute avant l'affichage approprié.
Je souhaite tout d'abord afficher la div "t_load" durant le chargement, et lorsque que celui-ci est entièrement terminé, afficher ensuite la div "t_lang".
De quelle façon "interagir" sur l'ordre d'exécution (si possible) ? merci

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
 
function prechargerImages() 
 {  
     if (document.images) 
     {
        var f_Image=prechargerImages.arguments;
        var prechargeTableau = new Array();
        for (var i=0; i < f_Image.length; i++)
            {
                prechargeTableau[i]= new Image;
                prechargeTableau[i].src=f_Image[i];                      
            }            
        }
 
//affiche tjrs la div AVANT le chargement...
        afficher('t_lang');            
    }
 
 
function afficher(id) 
{
 if (id=='t_load') 
    {
    document.getElementById('t_load').style.display='table';
    document.getElementById('t_lang').style.display='none';     
    }
else if (id=='t_lang')
    {
    document.getElementById('t_lang').style.display='table';   
    document.getElementById('t_load').style.display='none';
    } 
 }