1 pièce(s) jointe(s)
Loader / Afficher informations durant le chargement de la page
Bonjour à tous,
J'ai créé un gestionnaire d'albums photo/vidéo en php. A ce niveau-là, pas de problème.
Cependant, le traitement des photos et vidéos prend du temps. Il me fallait parfois plusieurs minutes pour afficher un album, ce qui ne pose pas réellement de problème mais afin d'informer l'utilisateur (moi ou une personne proche) de l'avancement, je souhaitais afficher des informations au fur et à mesure des actions à effectuer.
Le html de ma page est simple: il n'est composé que d'un div qui se place au centre de la page, au dessus d'un autre div vide qui se charge grâce à un script jQuery.
Mon script jQuery ressemble plus ou moins à cela (je l'ai énormément simplifié pour une meilleur compréhension)
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
$(window).load(function(){ //ou "$(document).ready" ça ne change rien
//Récupération de la liste des actions à effectuer
actions = loadListActions(...);
//J'effectue les différentes actions, j'affiche les photos/vidéos petit à petit
//Mais avant chaque action, j'affiche dans le div de chargement ce que je vais faire
$.each(actions, function(i, item) {
//Affichage des informations
$("div#loading").html("Load files ... / Creation ...");
//Action, ajax, chargement de html dans le div principal
DoSomething();
});
//une fois le chargement terminé, le div de chargement disparait et laisse place au div avec les photos/vidéos chargées
$("#loading").fadeOut();
}); |
Tout fonctionne parfaitement avec Firefox (Firebug est bien pratique dans le cas d'appels Ajax). Je vois l'affiche de message tel que "Traitement photo 1", puis "Traitement photo 2", ... comme ceci:
Pièce jointe 190432
Mais le problème, c'est que ça ne fonctionne pas sous Chrome ni IE. En fait, sur ces derniers, la page reste blanche (de quelques secondes à quelques minutes), toutes les actions s'effectuent bien et, une fois que tout est chargé, tout s'affiche d'un coup.
Si je laisse afficher le div des informations alors apparaît seulement la dernière information.
Comment faire donc pour avoir le même comportement sous Chrome et Firefox?
Comment faire pour que le div affichant les informations se rafraîchisse bien durant le chargement sur Chrome? et que ça ne se "freeze" pas durant le chargement.
Merci d'avance!
