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 :

Affichage simultané des images


Sujet :

JavaScript

  1. #1
    Membre à l'essai
    Inscrit en
    Décembre 2005
    Messages
    26
    Détails du profil
    Informations forums :
    Inscription : Décembre 2005
    Messages : 26
    Points : 13
    Points
    13
    Par défaut Affichage simultané des images
    Bonjour,

    J'ai deux images sur la page d'accueil de mon site web (une de 18 ko, et l'autre de 200 ko - je sais c'est beaucoup!!)...

    Comment faire pour que ces images apparaissent simultanément à la première connexion sur mon site, afin d'éviter l'enchaînement image par image de certains browsers et/ou l'affichage progressif de haut en bas...

    Quitte à laisser un écran noir pendant 1 seconde... 2 secondes max...

    Merci de me donner un exemple détaillé si possible...

  2. #2
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 644
    Points : 66 671
    Points
    66 671
    Billets dans le blog
    1
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    <script type='text/javascript'>
     var timer1
     
    function wait4images(){
    	var NrLoaded=0
    	imageTab=document.getElementsByTagName('img')
    	for(i=0;i<imagetab.length;i++)
    	 {NrLoaded+=(imagetab[i].complete)?1:0;}
     
        if (NrLoaded==imageTab.length){   clearInterval(timer1);
        										for(i=0;i<imagetab.length;i++){
        																			imageTab[i].style.visibility="visible"
        																		 }
        									}
    }    												
     
     
    function TestLoading(){
    timer1=setInterval(function(){wait4images()},10)
     }
    </script>
     
    </head>
     
    <body onload="TestLoading()">
     
    <img src="image1.gif" style="visibility:hidden;" />
    <img src="image2.gif" style="visibility:hidden;" />
     
     
    </body>
    </html>

  3. #3
    Membre à l'essai
    Inscrit en
    Décembre 2005
    Messages
    26
    Détails du profil
    Informations forums :
    Inscription : Décembre 2005
    Messages : 26
    Points : 13
    Points
    13
    Par défaut
    C'est vraiment génial, merci !!!

    Une autre question cependant : s'il me prend l'envie de mettre ce code à chaque page de mon site, comment faire pour ne pas le répéter à chaque fois... en d'autres termes, quelle partie dois-je couper/coller dans un fichier js (me semble -t'il), comment faire appel à ce code...
    bref, je suis encore un peu novice pour savoir comment faire ça au mieux....

    merci encore !!

  4. #4
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 644
    Points : 66 671
    Points
    66 671
    Billets dans le blog
    1
    Par défaut
    mets le javascript dans un fichier .js (sans les balises <script>)

    puis dans les pages :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <script type='text/javascript' src="lefichier.js"></script>
    puis tu fais appel au script dans le onload des la page

  5. #5
    Membre à l'essai
    Inscrit en
    Décembre 2005
    Messages
    26
    Détails du profil
    Informations forums :
    Inscription : Décembre 2005
    Messages : 26
    Points : 13
    Points
    13
    Par défaut
    Merci !!

    Je vais bien finir par mémoriser tout ça...

  6. #6
    Nouveau membre du Club
    Profil pro
    Inscrit en
    Avril 2005
    Messages
    41
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2005
    Messages : 41
    Points : 25
    Points
    25
    Par défaut
    Pour des images statiques, c'est parfait comme script.

    Mais si j'ai des swf et des images et que je veux qu'ils s'affichent tous en même temps ??

    Car le swf , même en hidden commence à se lancer sans attendre d'être visible.

  7. #7
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 644
    Points : 66 671
    Points
    66 671
    Billets dans le blog
    1
    Par défaut
    comment est intégré ton swf ?
    avec une balise object ...

    tu dois avoir un param autostart=false ...

  8. #8
    Nouveau membre du Club
    Profil pro
    Inscrit en
    Avril 2005
    Messages
    41
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2005
    Messages : 41
    Points : 25
    Points
    25
    Par défaut
    C'est ça dans une balise object.

    Donc je met autostart=false et après je le lance depuis le JS ?

    Vais essayer.

    Merci.

  9. #9
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 644
    Points : 66 671
    Points
    66 671
    Billets dans le blog
    1
    Par défaut
    tu t'arranges pour avoir l'utostart en false et lorsque le swf est complete tu bascule l'autostart à true ou tu lances le swf ...

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Réponses: 1
    Dernier message: 20/11/2011, 14h27
  2. [TCPDF] Lenteur de l'affichage avec des images
    Par UtopieAmbiante dans le forum Bibliothèques et frameworks
    Réponses: 2
    Dernier message: 27/08/2010, 11h59
  3. Affichage dégradé des images en mode html
    Par EFFLYINGJOKER dans le forum Débuter
    Réponses: 1
    Dernier message: 20/04/2010, 15h16
  4. Réponses: 3
    Dernier message: 02/04/2009, 15h42
  5. Affichage simultané des images
    Par gregbart dans le forum Balisage (X)HTML et validation W3C
    Réponses: 5
    Dernier message: 11/01/2006, 09h39

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