préchargement d'images

**clemsouz** · 15/11/2004, 11h56

Bonjour,
j'ai une page avec des images un peu lourde et j'aimerais précharger ces images pour quel s'affiche d'un coup.
J'ai trouvé ce script sur le net mais il ne semble pas marché très bien

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
33
34
35
36
37
38
39
40
41
42
43
44
45
 
<script
language="JavaScript1.2" type="text/javascript">
<!--
// Liste des images
var preload_images =
[
//  ...  Liste des images - avec virgule comme séparateur
"immo/IMMO_files/11_1.JPG" , "immo/IMMO_files/11_2.JPG"]
 
// Paramètres internes requis
var load_next = 500; // Intervalle entre deux chargements
var pos_array = 2;
 
// Fonction de chargement
function preload()
{
  // Chargement de l'image suivante
  var new_image = new Image()
  new_image.src = preload_images[pos_array]
 
  // Reste-t-il des images à charger ?
  pos_array++
  if(pos_array < preload_images.length){
    setTimeout('preload()', load_next);
  }else{
	this.location.href='programmes.php?id_prog=11';
  }
}
 
// Démarrage de la fonction de chargement préalable
function preload_start()
{
  // L'image existe ?
  if(preload_images.length == 0){
   	this.location.href='programmes.php?id_prog=11';
  }
 
  // Routine de vérification
  setTimeout('preload()', load_next)
}
// -->
</script>
</head>
<body onload="preload_start();">

dois-je chercher un autre script ?

**rjpf** · 15/11/2004, 15h53

Pour faire simple,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
var image1=new Image();// <-- on cree une variable de stockage de l'image 1
image1.src='1.png';// <-- c'est ici qu'on rapatrie l'image 1
 
var image2=new Image();// <-- on cree une variable de stockage de l'image 2
image2.src='2.png';// <-- c'est ici qu'on rapatrie l'image 2
 
var image3=new Image();// <-- on cree une variable de stockage de l'image 3
image3.src='3.png';// <-- c'est ici qu'on rapatrie l'image 3

Tu veille a ne pas detruire ces variables et ca fonctionnera.
Sinon tu peut adapter ce script à ta convenance, du genre :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
var imagesPrechargees=new Array();// <-- un tableau qui contiendra toutes les variables d'images
var mesImagesSources=['1.png','2.png','3.png'];// <-- les adresses des images
for(var i=0;i<3;i++){
  imagesPrechargees[i]=new Array();
  imagesPrechargees[i].src=mesImagesSources[i];
}

Enfin, il y a plein de solution, le seul truc a respecter : "il faut pas déférencer les variables des images préchargées" (ce qui est fait a chaque preload dans ton script)

++

**clemsouz** · 15/11/2004, 16h26

ça ne matche pas

g pris le deuxième script que ma proposé(plus facile à dynamisé) et : rien

pas d'erreur, mais toujours mon image qui s'affiche ligne par ligne...

si tu peux jeté un oeil, tu verras vite le problème :
http://www.immofaure.com/programmes.php?id_prog=14

**rjpf** · 15/11/2004, 21h01

Hein ?
C'est une plaisanterie ?
Le préchargement d'image ne multiplie pas la bande passante !
Ton image fait 1,3 Mo.
Enfin, je veux pas te déprimer, mais il faut peut etre savoir que si ton image s'affiche ligne après ligne, c'est parce que l'image est entrelacée (c'est fait pour ca)

Si tu veut quelle s'affiche tout d'un coup, le prechargement ne t'aidera pas pour ce que tu souhaite. en revanche, je saurait trop te conseiller de faire une miniature de cette image selon la taille d'affichage dans ta page et que cette miniature ne soit pas entrelacé.

++

**clemsouz** · 16/11/2004, 09h44

Je te rassure, ce n'est que pour des tests, le poids des images à l'exploitation du site seras(très probablement) moindre mais il risque d'y en avoir plus et le poid total de la page seras sensiblement le même.

Pour les miniatures, il faudrait que je les génère avec PHP, j'ai trouvée dans la doc :
- imagecopyresized (resource dst_im, resource src_im, int dstX, int dstY, int srcX, int srcY, int dstW, int
dstH, int srcW, int srcH)
- imageinterlace (resource im, int interlace)

ça devrait me servir mais je ne sais pas comment créé une ressource image dont ces fonction on besoin, t'as une idée ?

Sinon pour toi le préchargement est en place sur ma page ? c'est juste les image qui sont pas bonne ?

**rjpf** · 16/11/2004, 11h51

Salut,

Il me semble que le prechargement se fait correctement, seulement l'execution sur les image de cette taille impose necessairement des temps de latences. En fait considere plutot le préchargement comme une mise en cache de toutes les images listées.

Pour les miniatures, PHP et la GD2 me semblent un très bon choix. Je n'ai jamais utilisé donc je saurait pas te renseigner. Sur le phorum PHP il y a de temps en temps des questions par rapport aux miniaturisations d'images. Je pense que tu peut regarder dans les anciens post. Sinon la doc PHP sur la GD2 me semble bien faite (meme si j'ai toujours pas eu le temp de voir).

En ce qui me conserne, je te déconseillerai de faire des miniaturisations par PHP directement appelées par l'internaute car tu donnerai une surcharge de travail au serveur, alors que la miniaturisation par un logiciel de dessin et un upload simple resterons plus performent en terme de surcharge de travail et quantité de memoire utilisée à la consultation. Mais je suis pas la science infuse donc je veux pas t'embrouiller avec cela.

++

**clemsouz** · 16/11/2004, 13h47

et bien je vais me renseigner sur la GD2, en te remerciant pour tes conseil avisés

see y@

préchargement d'images

JavaScript

Discussions similaires

Partager

Partager