[JS] Image d'attente

Tous les benchmarks, vos résultats, vos tests.
Vos programmes, vos conseils logiciel
Votre matos, vos problèmes
Avatar de l’utilisateur
Aurelienazerty
Webmaster / Président
Messages : 19632
Inscription : septembre 27, 2002, 9:41 pm

[JS] Image d'attente

#1

Message par Aurelienazerty » décembre 8, 2006, 3:45 pm

Voilà, via un JS, je fait charger différentes images lors d'un passage de souris sur une cellule d'un tableau.
Or ces images sont générées via PHP et mettent pas mal de temps à se faire sur le serveur (4s min). Donc j'aimerais afficher durant ce laps de temps une autre image "Patientez" ou "Chargement".
Quelqu'un a t'il une idée ?
Aurelienazerty

Image

Avatar de l’utilisateur
Aurelienazerty
Webmaster / Président
Messages : 19632
Inscription : septembre 27, 2002, 9:41 pm

trouvé

#2

Message par Aurelienazerty » décembre 17, 2006, 7:12 pm

Bon j'ai trouvé un moyen de faire ça, donc j'ai procédé ainsi:
  • Mit une image transparente vide
  • un DIV placé sur l'image pour le texte d'attente
    /!\ les images de la suite doivent être bien évidement de la même taille sinon ça fout en l'air l'alignement
  • Au chargement de la page je cache le div
  • Au chargement de l'image j'affiche le DIV
  • Je fait un timeout de 3s (temps moyen pour générer l'image) pour cacher de nouveau le DIV
Voilà, c'est du bricolage, mais faut d'avoir trouvé mieux c'est la solution que j'ai mise sur pronofoot.
Si une âme charitable trouve mieux, je prend!
Aurelienazerty

Image

Avatar de l’utilisateur
Aurelienazerty
Webmaster / Président
Messages : 19632
Inscription : septembre 27, 2002, 9:41 pm

La vraie solution

#3

Message par Aurelienazerty » janvier 6, 2007, 11:20 am

Voilà, j'ai enfin trouvé la vraie solution:
  • Une image transparente vide
  • Sur cette image je rajoute l'attribut onload de la manière suivante:
    <img src='.....' alt='....' onload='ma fonction qui cache le div'>
  • un DIV placé sur l'image pour le texte d'attente
  • Lors du changement d'image je fais afficher le div
Aurelienazerty

Image

Répondre