Bonjour, j'ai une page avec une 15aine d'images a afficher. Je me suis donc tout d'abord penché vers des scripts de preload. Le probleme est que toutes les images se chargent en même temps et que ma page est remplie d'animations d'attentes... J'aurai donc aimé charger la première image et l'afficher, charger la deuxième image et l'afficher, ainsi de suite. Avec mon niveau de super débutant, je ne m'en sort pas trop.
Voila à peu près où j'en suis. Mon script commence par appeler la 1ere image avec un : document.write('l-image-que-je-veux-afficher.jpg')
Ensuite, Pour ne pas que les autres images commencent à se charger, j'ai crée une fonction qui, tant que l'image n'est pas completement chargée, ne fait que des pauses et qui s'appele elle même. La voici (l'image en question s'appele image01):
function verifimage01() {
// si l'image n'est pas encore chargée
if(document.images.image01.complete == false) {
// faire une pause de 500ms et relancer la fonction
setTimeout('verifimage01()',500)
}
}
Une fois que l'image est chargée, je continu mon script en écrivant une nouvelle image avec un "document.write()", et je reprend le même manege... Le probleme est qu'apparament, ça ne marche pas tres bien, parfois on dirait que le javascript abandonne...
Si vous voulez jetter un coup d'oeil à : ma page
Deux remarques :
C'est volontairement lourd à charger. En effet, afin de voir comment se comporte le tout, j'ai volontairement gardé des images assez lourdes car ma connexion est trop rapide (je vide le cache a chaque fois, mais ça va vite). J'optimiserai le poids de mes images une fois mon script OK.
J'ai crée une fonction de verification par image ( verifimage01(), verifimage02(), verifimage03(),... J'aurai pu faire une seule fonction qui vérifie une image dont le nom est indiqué en argument, mais je suis trop mauvais pour réussir a passer un argument dans une fonction...
Donc si vous pouvez m'aider à optimiser le chargement de ces images, c'est cool
Merci de votre aide, K
Partager