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 :

Cacher des images d'un tableau html


Sujet :

JavaScript

  1. #1
    Futur Membre du Club
    Homme Profil pro
    Inscrit en
    Mai 2011
    Messages
    16
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Suisse

    Informations forums :
    Inscription : Mai 2011
    Messages : 16
    Points : 5
    Points
    5
    Par défaut Cacher des images d'un tableau html
    Bonjour,

    Je fais actuellement un mini-jeu de Memory en php mysql.

    En ce moment j^'utilise le script ci-dessous afin de cacher mes images qui sont placées dans un tableau html :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
     
    <script language="javascript" type="text/javascript">
    <!--
    document.getElementById("img_<?php "$i".$j; ?>").style.visibility = "hidden" ;
    //-->
    </script>
    J'ai mit des variables php (et c'est sûrment ça le problème) car quand je créé mon tableau html, je met mes images directement tout en incrémentant $i et $j, et je voulais cacher les images une par une, exemple :

    Création de la première cellule 1.1 en html, y mettre l'image "4.png" avec un ID "1.1" et cacher l'image.

    Voici ce que ça donne en php :

    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
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
     
    ////////// Niveau Facile//////////
     
    // Test le niveau, si = à facile : Initialise un tableau en php en 4x4
    if ($_SESSION["niveau"] == "facile") 
    {
        $j = 1; //Ligne
        while($j <= 4)
        {
            ?>
            <tr>
            <?php
            $i = 1; //Colonne
            while($i <= 4)
            {
                $rand = rand(1, 16); // génére un nombre aléatoire
                $inctab = 1; // Variable qui incrémente la dimenssions
                while($inctab <=4)
                {
                    if (in_array($rand, $_SESSION["tblidc"][$inctab])) // Test si la var $rand existe déjà dans la dimensions[$inctab]
                    {
                        $rand = rand(1, 16); // génére un nouveau nombre aléatoire
                        $inctab = 1; // remettre le tab a 1 pour refaire une vérif.
                    }
                    else
                    {
                       $inctab++;
                    }
                }
     
                // Test si la valeur de rand est plus grand que 8
     
                ?><td width="50" height="50" id ="cell_<?php $i.$j; ?>" ><?php
                if ($rand <= 8)
                {
                    ?><img width="50" height="50" src="images/<?php echo $rand ?>.png" id ="img_<?php $i.$j; ?>" border="0" onClick="Click();"/><?php
                }
                else //Si le rand est plus grand que 8, on enlève 8 a celui-ci ce qui nous donne 9-8 = 1, 10-8 = 2, 11-8=3, etc...
                {
                    ?><img width="50" height="50" src="images/<?php echo $rand-8 ?>.png" id ="img_<?php $i.$j; ?>" border="0" onClick="Click();"/><?php
                }?></td>
                <?php
                $_SESSION["tblidc"][$j][$i] = $rand; // Permet de mettre un chiffre aléa. pour chaque case, exemple en 1.1, 1.2, etc. à l'aide des var $j et $i.
                $i++;
            }
            ?>
            </tr>
            <?php
            $j++;
        }
    }
    Pour tester mon petit script, j'avais mit les ID en dur et j'avais que l'image de la première cellule caché :



    Je n'arrive pas a trouver un moyen d'incrémenter les ID en créant le tableau html et en mettant les images à l'intérieur et de les cacher par la suite....

    J'ai vraiment besoin d'aide, j'ai chercher sur le forum et je n'arrive pas a trouver une solution...

  2. #2
    Expert confirmé
    Avatar de Loceka
    Profil pro
    Inscrit en
    Mars 2004
    Messages
    2 276
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2004
    Messages : 2 276
    Points : 4 842
    Points
    4 842
    Par défaut
    Si c'est un problème javascript, poste le code HTML généré. Si c'est un problème PHP poste dans le forum PHP.

  3. #3
    Futur Membre du Club
    Homme Profil pro
    Inscrit en
    Mai 2011
    Messages
    16
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Suisse

    Informations forums :
    Inscription : Mai 2011
    Messages : 16
    Points : 5
    Points
    5
    Par défaut
    Je pense que mon problème vient de mon script.

    Pour le code HTML, il y est dans le PHP que j'ai posté.

    En fait, c'est juste ceci qui est important pour le script :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
     
    <td width="50" height="50" id ="cell_<?php $i.$j; ?>" ><?php
    if ($rand <= 8)
    {
        ?><img width="50" height="50" src="images/<?php echo $rand ?>.png" id ="img_<?php $i.$j; ?>" border="0" onClick="Click();"/><?php
     
    }
    else //Si le rand est plus grand que 8, on enlève 8 a celui-ci ce qui nous donne 9-8 = 1, 10-8 = 2, 11-8=3, etc...
    {
        ?><img width="50" height="50" src="images/<?php echo $rand-8 ?>.png" id ="img_<?php $i.$j; ?>" border="0" onClick="Click();"/><?php
    }</td>
    Il faut retenir que les variables $i et $j que j'utilise pour les ID sont en fait des variables php que j'incrémente pour faire mon tableau html que j'ai posté en image dans le post précédent.

    Pour ce qui est de la variable $rand, celle-ci génère un nombre aléatoire entre 1 et 16 pour placer mes images aléatoirement.

  4. #4
    Nouveau membre du Club
    Homme Profil pro
    Webdesigner & Intégrateur web
    Inscrit en
    Mai 2011
    Messages
    23
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Loir et Cher (Centre)

    Informations professionnelles :
    Activité : Webdesigner & Intégrateur web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mai 2011
    Messages : 23
    Points : 29
    Points
    29
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    document.getElementById("img_<?php "$i".$j; ?>").style.visibility = "hidden" ;
    J'espère que tu t'attend pas à ce que cette ligne cache l'image correspondant à chaque parcours de la boucle while, parce que, php te renvoie le résultat final de ton script à la fin de son execution, il n'envoie pas au fur et a mesure.

    essaye plutôt quelque chose comme :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    document.getElementsByTag("img").style.visibility = "hidden" ;
    Au chargement de ta page HTML, ça chope toutes les images.

    En plus il y a une faute : "img_<?php echo $i.'.'.$j; ?>"

Discussions similaires

  1. cacher des lignes d'un tableau html
    Par guigui69 dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 19/10/2009, 22h09
  2. Réponses: 2
    Dernier message: 25/05/2009, 09h38
  3. [HTML] afficher des courbes dans un tableau html ?
    Par MAJIK_ENIS dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 10/05/2006, 15h19
  4. Cacher des lignes d'un tableau
    Par frechy dans le forum Balisage (X)HTML et validation W3C
    Réponses: 5
    Dernier message: 18/07/2005, 12h05
  5. [VB6] recuperer des valeurs ds un tableau html avec vb!!
    Par leo13 dans le forum VB 6 et antérieur
    Réponses: 3
    Dernier message: 11/12/2004, 13h02

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