Timer pour chargement d'image

Fermé
Yimimura - 17 juin 2008 à 19:05
 slach24 - 5 févr. 2009 à 11:20
Bien le bonjour,

Voila je suis en ce moment en train de créer le site d'une association pour un stage,
et l'une des pages que je créer contient des images en grand nombre
(en gros ce sont les miniatures de photos d'événementiels soutenus par ladite assoc) qui lorsque l'on click dessus font l'effet d'affichage importé via lightbox,
a ce niveau la aucun soucis.

Non la vraie question c'est celle ci: est il possible en php,
ou n'importe quelle autre methode exceptée flash
(oui pas trop envie de me casser la tête a faire un diaporama flash) de faire que lorsque l'on click sur le lien de la page contenant les photos,
afin d'éviter que quelqu'un click direct sur la premiére image (empéchant le lancement de l'effet lightbox),
de faire en sorte qu'un "timer" apparaisse, empéchant toutes action en attendant que la totalité de la page soit chargée avec si possible un petit icone en gif (comme ce lui de lightbox justement) pour faire comprendre que la page charge et qu'il faut patienter.

Merci d'avance :)
A voir également:

3 réponses

Mimiste Messages postés 1149 Date d'inscription samedi 17 mai 2008 Statut Membre Dernière intervention 6 mars 2016 206
17 juin 2008 à 19:07
Oui c'est possible et c'est en javascript

Le but de la manoeuvre etant d'afficher une div (qui contient une animation ou pas, comme tu veu) en position absolue sur toute la page tant que toute les images ne sont pas chargée
0
serait il possible d'avoir un exemple dans ce cas? ou le script? que je comprenne un peu mieux la manœuvre s'il te plait?
0
Mimiste Messages postés 1149 Date d'inscription samedi 17 mai 2008 Statut Membre Dernière intervention 6 mars 2016 206
19 juin 2008 à 11:53
tien je t'envoi sur un site que j'ai réalise et qui utilise ce principe

www.achtungdass.com

quand tu clic sur "enter" tu verra une page de loading, c'est une DIV qui prend tout l'ecran et qui ne s'efface que lorsque tout les images ont été chargée

Regarde la source pour le code, rien n'est caché ;)

le script est celui ci

function preload(){
document.getElementById("preloadCache").style.visibility = "visible"; //J'affiche la DIV
var pageHTML = document.getElementsByTagName("img") // Je recupere toute les images
var totalImage = pageHTML.length // Je compte combien y en a

if (i < totalImage){ //Si i est inferieur au nombre d'image
if (pageHTML.item(i).complete) { // Je regarde si l'image a l'index i est fini de télécharger
i++ // J'incremente i pour passer a limage suivante
setTimeout(preload) // je relance cette fonction pour continuer (sorte de boucle)
}
} else {
document.getElementById("loader").style.visibility = "hidden"; //Je cache ma DIV
document.getElementById("preloadCache").style.visibility = "hidden"; //Je cache ma DIV
document.getElementById("menu").style.visibility = "visible";
document.getElementById("playerlink").style.visibility = "visible";
document.body.scroll="yes";
}
}


0
slach24 > Mimiste Messages postés 1149 Date d'inscription samedi 17 mai 2008 Statut Membre Dernière intervention 6 mars 2016
5 févr. 2009 à 11:20
Merci bcp pour cette fonction, est ce que je peux faire ce loading pour les elements d un formulaire?

document.getElementsByTagName("input") au lieu de document.getElementsByTagName("img")

MErci
0
Merci beaucoup, je vais bien "analyser" le tout afin d'assimiler ça, c'est totalement ce que je recher :) Vraiment merci :)
0