IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Insérer un "loader" dans une page et /ou un compteur d'octets


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre confirmé
    Homme Profil pro
    Étudiant
    Inscrit en
    Mars 2016
    Messages
    83
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Mars 2016
    Messages : 83
    Par défaut Insérer un "loader" dans une page et /ou un compteur d'octets
    Bonjour

    J'ai une page HTML locale qui "charge" sur le net des images météo. Les images se chargent l'une au dessus de l'autre et un script me permet de les rendre visibles l'une après l'autre avec la roulette de ma souris.
    Je cherche si il est possible d'insérer un "loader" qui m'indiquerai où en est le téléchargement de l'ensemble des images tout en pouvant compulser les images déjà chargées.
    D'autre part il me serait très utiles de connaitre le poids de la page téléchargée étant donné que les images et leurs nombres sont toujours différents. J'ai une connexion 3/4G avec un volume de data limité. (Ce pourrait être à défaut,une extension de chrome ou encore un programme pour Windows, mais je n'ai rien trouvé)
    Avez-vous des infos sur un "loader" et/ou un compteur d'octets ?
    Merci

  2. #2
    Membre Expert
    Homme Profil pro
    Directeur technique
    Inscrit en
    Janvier 2007
    Messages
    1 348
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 48
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Directeur technique

    Informations forums :
    Inscription : Janvier 2007
    Messages : 1 348
    Par défaut
    Pour le loader, tu peux en trouver plein des tout fait. Par exemple http://blog.site-web-creation.net/jquery-loader/
    Pour savoir le poids d'une page, tu peux simplement utiliser le debugger chrome (en appuyant sur F12) dans l'onglet réseau

  3. #3
    Membre confirmé
    Homme Profil pro
    Étudiant
    Inscrit en
    Mars 2016
    Messages
    83
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Mars 2016
    Messages : 83
    Par défaut
    Oui, il existe beaucoup de très joli "loader" sur la toile. Le problème est de savoir comment l'utiliser dans les conditions que je cite dans mon message précédent.
    Le F12 sur Chrome, ok mais ou puis-je voir le poids de la page ?

  4. #4
    Membre confirmé
    Homme Profil pro
    Étudiant
    Inscrit en
    Mars 2016
    Messages
    83
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Mars 2016
    Messages : 83
    Par défaut
    Ne pourrait on pas utiliser ceci : Document.readyState ?
    J'ai fait quelques test, mais je reçois un "complete" avant que les images ne soient chargées...

  5. #5
    Membre Expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 910
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 910
    Par défaut
    Salut,

    Le problème c'est que ta page se charge en deux temps : tout d'abord la page elle-même (les balises, le script, le css...) et ensuite les images lorsque tu cliques sur le bouton "Go" or j'ai l'impression que les loaders se préoccupent de la page entière et se déclenchent au chargement donc ça risque de ne pas te convenir... (par exemple dans le lien indiqué ci-dessus il est bien dit "Pour en revenir à notre loader de page, ce dernier se « contentera » de détecter les images présentes dans la page dans une balise image img ." mais comme déjà dit dans ton cas il n'y a pas d'images au début car elles sont chargées seulement quand tu cliques sur le bouton "Go"...).

    J'ai l'impression qu'ils se basent sur l’événement onload... Dans ton cas je pense que tu pourrais utiliser cela pour chaque image ainsi tu saurais quelles sont les images qui sont chargées... Tu pourrais alors afficher "image n°x chargée" et tu pourrais par calcule obtenir le pourcentage...

    Pour la page elle-même de toute façon tu la charges hors connexion donc cela ne devrait pas poser problème...

    Pour le nombre d'octets c'est surtout celui de l'ensemble des images qui t'intéresse normalement et tu peux le connaitre une fois que tu enregistres la page en faisant Ctrl + S...

    Je ne sais pas si tu vois ce que je veux dire...

  6. #6
    Membre confirmé
    Homme Profil pro
    Étudiant
    Inscrit en
    Mars 2016
    Messages
    83
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Mars 2016
    Messages : 83
    Par défaut
    Ta réflexion est très pertinente. Et qu'effectivement dans les tests que j'ai pu faire le loader fonctionne au chargement de la page, mais pas lorsque l'on clique sur GO. Un loader sur chaque image ? As-tu une idée derrière la tête ?

Discussions similaires

  1. Réponses: 10
    Dernier message: 07/08/2019, 15h52
  2. Réponses: 2
    Dernier message: 03/03/2013, 12h54
  3. Insérer un calendrier Flash/XML dans une page PHP
    Par paricilas dans le forum Flash
    Réponses: 3
    Dernier message: 23/02/2007, 15h29

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo