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 :

Afficher image aléatoirement


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre confirmé

    Homme Profil pro
    Enseignant Chercheur
    Inscrit en
    Novembre 2007
    Messages
    94
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 53
    Localisation : France, Corse (Corse)

    Informations professionnelles :
    Activité : Enseignant Chercheur
    Secteur : Enseignement

    Informations forums :
    Inscription : Novembre 2007
    Messages : 94
    Par défaut Afficher image aléatoirement
    Bonjour.
    Je souhaite afficher une image aléatoirement sur une page web.

    J'ai créé le tableau contenant les images.
    Je fais calculer aléatoirement un entier de 1 à 6 (nombre d'images).
    Ensuite, je demande d'afficher le résultat.

    L'image n'apparaît pas, j'ai juste un petit carré.
    Je ne vois pas où je me trompe.

    D'avance merci.

    NB : la dernière ligné était juste pour vérifier que les images étaient à la bonne place. Elles le sont : l'image s'affiche dans la page.
    Code html : 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
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    <head>
    <script type="text/javascript"
      src="http://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
     
    </head>
     
     
     
     
     
    <script>
    const ListeImages = [
    '<img src="D:\BOULOT\BP Melec\2nde\Maths\Probas\Images\dé_3.gif" alt="1"></img>',
    '<img src="D:\BOULOT\BP Melec\2nde\Maths\Probas\Images\dé_2.gif" alt="2"></img>',
    '<img src="D:\BOULOT\BP Melec\2nde\Maths\Probas\Images\dé_5.gif" alt="3"></img>',
    '<img src="D:\BOULOT\BP Melec\2nde\Maths\Probas\Images\dé_6.gif" alt="4"></img>',
    '<img src="D:\BOULOT\BP Melec\2nde\Maths\Probas\Images\dé_4.gif" alt="5"></img>',
    '<img src="D:\BOULOT\BP Melec\2nde\Maths\Probas\Images\dé_1.gif" alt="6"></img>',
     
    ];
     
     
     
    function afficherImage() {
    var a = Math.floor(Math.random() * 6);
    var image = ListeImages[a];
     
    document.getElementById('Affichage').innerHTML = image;
     
     
    }
     
    setInterval(afficherImage, 1000);
     
     
    </script>
     
     
    <body onload="afficherImage()">
    	<div id="Affichage"></div>
     
     
    </body>
    <img src="D:\BOULOT\BP Melec\2nde\Maths\Probas\Images\dé_1.gif" ></img>

  2. #2
    Expert confirmé
    Avatar de mathieu
    Profil pro
    Inscrit en
    Juin 2003
    Messages
    10 668
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2003
    Messages : 10 668
    Par défaut
    affichez le contenu de la variable image dans la console avec console.log(image);.

  3. #3
    Membre confirmé

    Homme Profil pro
    Enseignant Chercheur
    Inscrit en
    Novembre 2007
    Messages
    94
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 53
    Localisation : France, Corse (Corse)

    Informations professionnelles :
    Activité : Enseignant Chercheur
    Secteur : Enseignement

    Informations forums :
    Inscription : Novembre 2007
    Messages : 94
    Par défaut
    Re-bonjour.
    Merci... mais cela ne fonctionnait pas non plus.
    J'ai changé les chemins en les restreignant à dé_1.gif....etc.
    Ca fonctionne.
    Une histoire de "chemin"... bizarre car avec la dernière ligne qui contient tout le chemin, ça fonctionne...

    Merci.
    Bonne journée.
    Code html : 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
    33
    34
    35
    <script>
     
    const ListeImages = [
    '<img src="de1.gif" alt="1"></img>',
    '<img src="de2.gif" alt="2"></img>',
    '<img src="de3.gif" alt="3"></img>',
    '<img src="de4.gif" alt="4"></img>',
    '<img src="de5.gif" alt="5"></img>',
    '<img src="de6.gif" alt="6"></img>',
     
    ];
     
     
     
    function afficherImage() {
    var a = Math.floor(Math.random() * 6);
    var image = ListeImages[a];
     
     
    document.getElementById('Affichage').innerHTML = image;
     
     
    }
     
    setInterval(afficherImage, 5000);
     
     
     
    </script>
     
     
    <body onload="afficherImage()">
    	<div id="Affichage"></div>
    		<img src="D:\BOULOT\BP Melec\2nde\Maths\Probas\Images\de1.gif"></img>
    </body>

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

Discussions similaires

  1. Afficher une image aléatoire
    Par Moloc'h dans le forum Contribuez / Téléchargez Sources et Outils
    Réponses: 2
    Dernier message: 14/07/2012, 23h06
  2. Réponses: 11
    Dernier message: 01/06/2012, 10h49
  3. Afficher 15 images aléatoires
    Par jarod6827 dans le forum Général JavaScript
    Réponses: 0
    Dernier message: 10/04/2010, 17h24
  4. Afficher une image aléatoirement sur un forum
    Par Lysgard dans le forum Langage
    Réponses: 5
    Dernier message: 30/01/2009, 14h32
  5. Afficher une image aléatoirement
    Par morgan47 dans le forum Langage
    Réponses: 5
    Dernier message: 23/10/2007, 12h42

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