Attendre chargement imageRésolu

Question

Bonjour !
    
   Je souhaiterais bloquer l'exécution de mon script pendant qu'une image se charge et le reprendre après, autrement dit attendre qu'une image soit chargée.
Vous allez me dire " à quoi cela-te sert-il ? ", à quoi je répondrais que je fabrique un quizz en DHTML, et que l'utilisateur doit cliquer sur une image parmi 4 à chaque question, or à la question suivante certaines images nt été remplacées et d'autres non et l'utilisateur risquerait de cliquer sur une image ancienne.
Je voudrais donc au début du script qui affiche les images mettre une variable à 0 et la mettre à 1 après le chargement complet, et quand l'utilisateur clique sur une image et que cette variable est à 0 lui dire d'attendre.
Biensûr cette fonction d'attente doit laisser l'image se charger et ne pas tout bloquer ce que ne fait pas ma fonction brute :

do {}
while (! document.getElementById("img1").complete)

si une sorte de Application.ProcessMessages de Delphi existait en JavaScript ce serait bien pour ce genre de boucle !...

Merci de m'aider.

Au revoir !

SISI231

XtremDuke · Accepted Answer

Faire une boucle jusqu'à chargement complet de ton image n'est pas conseillé. Ton navigateur peut même t'avertir d'une redondance trop importante et te proposer de geler le JS (enfin sous FF, je n'ai jamais testé sous IE).

Je te conseilles de créer dynamiquement ton image à base de :

var monImageJS = new Image;
monImageJS.onload = function(){
   document.getElementById('monImageDOM').src = monImageJS.src;
   //Et la suite de ton JS à executer quand chargement fini...
}
monImageJS.src = 'url_de_ton_image';

ThomasDele · Answer

C'est une question qui me traverse l'esprit également en ce moment.

cs_bultez · Answer

Bonjour,

    tester si .complete dans une fonction [r]appelée par setTimeout

<hr />                Cordialement             Bul

sisi231 · Answer

Merci, ça marche, bien que cela entraîne que je doive repenser une partie l'architecture du code.

SISI231

PatetHT · Answer

dfghfghfg
fg
hf
hf
h
f
hg
ghhhhhhhhhhhhhhhhh

Attendre chargement image

5 réponses

Votre réponse