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 :

Positionnement aléatoire dans une page web


Sujet :

JavaScript

  1. #1
    Futur Membre du Club
    Homme Profil pro
    Collégien
    Inscrit en
    Octobre 2013
    Messages
    2
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Cameroun

    Informations professionnelles :
    Activité : Collégien
    Secteur : Transports

    Informations forums :
    Inscription : Octobre 2013
    Messages : 2
    Par défaut Positionnement aléatoire dans une page web
    Bonjour, je travail sur un jeu de role où les joueur se deplacent dans un espace de 20 x 20 cases. parmi ces cases il y en a qui sont innaccessible et ont la couleur grise, elles apparaissent de facon alleatoire à chaque chargement de page, les deux joueurs aussi apparaisent de facon alleatoire, mon probleme c'est que quand je recharge à plusieur reprise mon naviguateur, le joueur se retrouve dans la meme case que la case innaccessible, or le joueur ne doit pas etre sur la case innaccessible et les joueur ne doivent pas se toucher (au chargement du naviguateur); ai ce une mauvaise condition? aidez moi, voici mon code, un peu long je sais
    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
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
    159
    160
    161
    162
    163
    164
    165
    166
    167
    168
    169
    170
    171
    172
    173
    174
    175
    176
    177
    178
    179
    180
    181
    182
    183
    184
    185
    186
    187
    188
    189
    190
    191
    192
    193
    194
    195
    196
    197
    198
    199
    200
    201
    202
    203
    204
    205
    206
    207
    208
    209
    210
    211
    212
    213
    214
    215
    216
    217
    218
    219
    220
    221
    222
    223
    224
    225
    226
    227
    228
    229
    230
    231
    232
    233
    234
    235
    236
    237
    238
    239
    240
    241
    242
    243
    244
    245
    246
    247
    248
    249
    250
    251
    252
    253
    254
    255
    256
    257
    258
    259
    260
    261
    262
    263
    264
    265
    266
    267
    268
    269
    270
    271
    272
    273
    274
    275
    276
    277
    278
    279
    280
    281
    282
    283
    284
    285
    286
    287
    288
    289
    290
    291
    292
    293
    294
    295
    296
    297
    298
    299
    300
    301
    302
    303
    304
    305
    306
    307
    308
    309
    310
    311
    312
    313
    314
    315
    316
    317
    318
    319
    320
    321
    322
    323
    324
    325
    326
    327
    328
    329
    330
    331
    332
    333
    334
    335
    336
    337
    338
    339
    340
    341
    342
    343
    344
    345
    346
    347
    348
    349
    var div=document.getElementById('general');
    var cases=div.getElementsByTagName('div');
    var a=div.getElementsByClassName('lignea');
    var b=div.getElementsByClassName('ligneb');
    var c=div.getElementsByClassName('lignec');
    var d=div.getElementsByClassName('ligned');
    var e=div.getElementsByClassName('lignee');
    var f=div.getElementsByClassName('lignef');
    var g=div.getElementsByClassName('ligneg');
    var h=div.getElementsByClassName('ligneh');
    var i=div.getElementsByClassName('lignei');
    var j=div.getElementsByClassName('lignej');
    // recuperation des cases
    var a0=document.getElementById('a0');
    var a1=document.getElementById('a1');
    var a2=document.getElementById('a2');
    var a3=document.getElementById('a3');
    var a4=document.getElementById('a4');
    var a5=document.getElementById('a5');
    var a6=document.getElementById('a6');
    var a7=document.getElementById('a7');
    var a8=document.getElementById('a8');
    var a9=document.getElementById('a9');
     
    var b0=document.getElementById('b0');
    var b1=document.getElementById('b1');
    var b2=document.getElementById('b2');
    var b3=document.getElementById('b3');
    var b4=document.getElementById('b4');
    var b5=document.getElementById('b5');
    var b6=document.getElementById('b6');
    var b7=document.getElementById('b7');
    var b8=document.getElementById('b8');
    var b9=document.getElementById('b9');
     
    var c0=document.getElementById('c0');
    var c1=document.getElementById('c1');
    var c2=document.getElementById('c2');
    var c3=document.getElementById('c3');
    var c4=document.getElementById('c4');
    var c5=document.getElementById('c5');
    var c6=document.getElementById('c6');
    var c7=document.getElementById('c7');
    var c8=document.getElementById('c8');
    var c9=document.getElementById('c9');
     
    var d0=document.getElementById('d0');
    var d1=document.getElementById('d1');
    var d2=document.getElementById('d2');
    var d3=document.getElementById('d3');
    var d4=document.getElementById('d4');
    var d5=document.getElementById('d5');
    var d6=document.getElementById('d6');
    var d7=document.getElementById('d7');
    var d8=document.getElementById('d8');
    var d9=document.getElementById('d9');
     
    var e0=document.getElementById('e0');
    var e1=document.getElementById('e1');
    var e2=document.getElementById('e2');
    var e3=document.getElementById('e3');
    var e4=document.getElementById('e4');
    var e5=document.getElementById('e5');
    var e6=document.getElementById('e6');
    var e7=document.getElementById('e7');
    var e8=document.getElementById('e8');
    var e9=document.getElementById('e9');
     
    var f0=document.getElementById('f0');
    var f1=document.getElementById('f1');
    var f2=document.getElementById('f2');
    var f3=document.getElementById('f3');
    var f4=document.getElementById('f4');
    var f5=document.getElementById('f5');
    var f6=document.getElementById('f6');
    var f7=document.getElementById('f7');
    var f8=document.getElementById('f8');
    var f9=document.getElementById('f9');
     
    var g0=document.getElementById('g0');
    var g1=document.getElementById('g1');
    var g2=document.getElementById('g2');
    var g3=document.getElementById('g3');
    var g4=document.getElementById('g4');
    var g5=document.getElementById('g5');
    var g6=document.getElementById('g6');
    var g7=document.getElementById('g7');
    var g8=document.getElementById('g8');
    var g9=document.getElementById('g9');
     
    var h0=document.getElementById('h0');
    var h1=document.getElementById('h1');
    var h2=document.getElementById('h2');
    var h3=document.getElementById('h3');
    var h4=document.getElementById('h4');
    var h5=document.getElementById('h5');
    var h6=document.getElementById('h6');
    var h7=document.getElementById('h7');
    var h8=document.getElementById('h8');
    var h9=document.getElementById('h9');
     
    var i0=document.getElementById('i0');
    var i1=document.getElementById('i1');
    var i2=document.getElementById('i2');
    var i3=document.getElementById('i3');
    var i4=document.getElementById('i4');
    var i5=document.getElementById('i5');
    var i6=document.getElementById('i6');
    var i7=document.getElementById('i7');
    var i8=document.getElementById('i8');
    var i9=document.getElementById('i9');
     
    var j0=document.getElementById('j0');
    var j1=document.getElementById('j1');
    var j2=document.getElementById('j2');
    var j3=document.getElementById('j3');
    var j4=document.getElementById('j4');
    var j5=document.getElementById('j5');
    var j6=document.getElementById('j6');
    var j7=document.getElementById('j7');
    var j8=document.getElementById('j8');
    var j9=document.getElementById('j9');
     
    //tableau devant contenir toutes les cases
    var tab=[];
     
    //ajout des elements dans le tableau
     
    tab.push(a0);
    tab.push(a1);
    tab.push(a2);
    tab.push(a3);
    tab.push(a4);
    tab.push(a5);
    tab.push(a6);
    tab.push(a7);
    tab.push(a8);
    tab.push(a9);
     
    tab.push(b0);
    tab.push(b1);
    tab.push(b2);
    tab.push(b3);
    tab.push(b4);
    tab.push(b5);
    tab.push(b6);
    tab.push(b7);
    tab.push(b8);
    tab.push(b9);
     
    tab.push(c0);
    tab.push(c1);
    tab.push(c2);
    tab.push(c3);
    tab.push(c4);
    tab.push(c5);
    tab.push(c6);
    tab.push(c7);
    tab.push(c8);
    tab.push(c9);
     
    tab.push(d0);
    tab.push(d1);
    tab.push(d2);
    tab.push(d3);
    tab.push(d4);
    tab.push(d5);
    tab.push(d6);
    tab.push(d7);
    tab.push(d8);
    tab.push(d9);
     
    tab.push(e0);
    tab.push(e1);
    tab.push(e2);
    tab.push(e3);
    tab.push(e4);
    tab.push(e5);
    tab.push(e6);
    tab.push(e7);
    tab.push(e8);
    tab.push(e9);
     
    tab.push(f0);
    tab.push(f1);
    tab.push(f2);
    tab.push(f3);
    tab.push(f4);
    tab.push(f5);
    tab.push(f6);
    tab.push(f7);
    tab.push(f8);
    tab.push(f9);
     
    tab.push(g0);
    tab.push(g1);
    tab.push(g2);
    tab.push(g3);
    tab.push(g4);
    tab.push(g5);
    tab.push(g6);
    tab.push(g7);
    tab.push(g8);
    tab.push(g9);
     
    tab.push(h0);
    tab.push(h1);
    tab.push(h2);
    tab.push(h3);
    tab.push(h4);
    tab.push(h5);
    tab.push(h6);
    tab.push(h7);
    tab.push(h8);
    tab.push(h9);
     
    tab.push(i0);
    tab.push(i1);
    tab.push(i2);
    tab.push(i3);
    tab.push(i4);
    tab.push(i5);
    tab.push(i6);
    tab.push(i7);
    tab.push(i8);
    tab.push(i9);
     
    tab.push(j0);
    tab.push(j1);
    tab.push(j2);
    tab.push(j3);
    tab.push(j4);
    tab.push(j5);
    tab.push(j6);
    tab.push(j7);
    tab.push(j8);
    tab.push(j9);
     
    var msg=function(text){
       var affiche= console.log(text);
        return affiche;
    }
     
    //fonction pour positionner les cases innaccessible
     
     
         var caseBlocque= function(){
        var solution = Math.floor(Math.random() * 100) + 1;
             var inaccessible=0;
             for(var i=0;i<tab.length;i++){
                 if(solution===i){
                     inaccessible=tab[i];
                 inaccessible.style.backgroundColor='gray';
                      return tab [i] ;
             }
     
     
             }
    }
     
         var tab1=[];
    var block1=caseBlocque();
    var block2=caseBlocque();
    var block3=caseBlocque();
    var block4=caseBlocque();
    var block5=caseBlocque();
    var block6=caseBlocque();
    var block7=caseBlocque();
    var block8=caseBlocque();
    var block9=caseBlocque();
    var block10=caseBlocque();
    var block11=caseBlocque();
    var block12=caseBlocque();
    var block13=caseBlocque();
    var block14=caseBlocque();
    msg(block10);
    //creation d’un tableau de blocs innacccessible
    tab1.push(block1);
    tab1.push(block2);
    tab1.push(block3);
    tab1.push(block4);
    tab1.push(block5);
    tab1.push(block6);
    tab1.push(block7);
    tab1.push(block8);
    tab1.push(block9);
    tab1.push(block10);
    tab1.push(block11);
    tab1.push(block12);
    tab1.push(block13);
    tab1.push(block14);
    msg(tab1);
    // creation  du joueur
    var joueur1=document.createElement("img");
    joueur1.class ="rambo";
    joueur1.src="../img/perso1.jpg";
    console.log(joueur1);
     
     
     
    // fonction de positionnement du joueur
       var positionnerJoueur= function(){
          var solution = Math.floor(Math.random() * 100) + 1;
            console.log(solution);
     
            for(var i=0;i<=tab.length;i++){
                if(solution===i){
                    if(tab[i]===tab1[0]){
                        tab1[0].style.backgroundColor=""   ;
                    }else if(tab[i]===tab1[1]){
                        tab1[1].style.backgroundColor=""   ;
                    }else if(tab[i]===tab1[2]){
                        tab1[2].style.backgroundColor=""   ;
                    }else if(tab[i]===tab1[3]){
                        tab1[3]  .style.backgroundColor=""   ;
                    }else if(tab[i]===tab1[4]){
                        tab1[4].style.backgroundColor=""   ;
                    }else if(tab[i]===tab1[5]){
                        tab1[5].style.backgroundColor=""   ;
                    }else if(tab[i]===tab1[6]){
                        tab1[6].style.backgroundColor=""   ;
                    }else if(tab[i]===tab1[7]){
                        tab1[7].style.backgroundColor=""   ;
                    }else if(tab[i]===tab1[8]){
                        tab1[8].style.backgroundColor=""   ;
                    }else if(tab[i]===tab1[9]){
                        tab1[9].style.backgroundColor=""   ;
                    }else if(tab[i]===tab1[10]){
                        tab1[10].style.backgroundColor=""   ;
                    }else if(tab[i]===tab1[11]){
                        tab1[11].style.backgroundColor=""   ;
                    }else if(tab[i]===tab1[12]){
                        tab1[12].style.backgroundColor=""   ;
                    }else if(tab[i]===tab1[13]){
                        tab1[13].style.backgroundColor=""   ;
                    } else{
                        tab[i]=solution;
                    }
     
     
     
                       }
                       tab[i].appendChild(joueur1);
     
     
                }};
     
     
                       positionnerJoueur();

  2. #2
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    Février 2009
    Messages
    6 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : Février 2009
    Messages : 6 389
    Billets dans le blog
    125
    Par défaut
    Quelle complication !

    Exemple de placement dans une table de 10 * 10 :

    EDIT : je vois que j'ai oublié de tenir compte des cases inaccessibles pour placer le joueur !

    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
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
    159
    160
    161
    162
    163
    164
    165
    166
    167
    168
    169
    170
    171
    172
    173
    174
    175
    176
    177
    178
    179
    180
    181
    182
    183
    <!DOCTYPE html>
    <html lang="fr" dir="ltr">
    <head>
      <meta http-equiv="cache-control" content="public, max-age=60">
      <meta charset="utf-8">
      <meta name="viewport" content="initial-scale=1.0">
      <meta name="author" content="Daniel Hagnoul">
      <title>Joueur</title>
      <style>
        td { height: 20px; width: 20px; border: 1px dotted grey; padding: 6px; }
      </style>
    </head>
    <body>
      <table id="monJeu">
        <thead>
          <tr>
            <th></th>
            <th>A</th>
            <th>B</th>
            <th>C</th>
            <th>D</th>
            <th>E</th>
            <th>F</th>
            <th>G</th>
            <th>H</th>
            <th>I</th>
            <th>J</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <th>1</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>2</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>3</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>4</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>5</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>6</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>7</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>8</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>9</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>10</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
        </tbody>
      </table>
      <script>
        var
          monJeu = document.querySelector( "#monJeu" ),
          lignes = monJeu.rows,
          joueur = [ Math.floor( Math.random() * 10 ) + 1, Math.floor( Math.random() * 10 ) + 1 ];
     
        // une case inacessible par ligne
        for ( var i = 1; i < 11; i++ ){
          lignes[ i ].cells[ Math.floor( Math.random() * 10 ) + 1 ].style.backgroundColor = 'gray';
        }
     
        // placement du joueur (fond rouge)
        lignes[ joueur[ 0 ] ].cells[ joueur[ 1 ] ].style.backgroundColor = 'red';
     
        // debug, console, touche F12
        //console.log( "lignes : ", lignes );
        //console.log( "lignes 2 cells : ", lignes[ 2 ].cells );
        //console.log( "joueur : ", joueur );
      </script>
    </body>
    </html>

    Blog

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

  3. #3
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    Février 2009
    Messages
    6 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : Février 2009
    Messages : 6 389
    Billets dans le blog
    125
    Par défaut
    Désolé pour le retard, j'ai été fort occupé jusque maintenant.

    Version avec "anticollision" :

    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
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
    159
    160
    161
    162
    163
    164
    165
    166
    167
    168
    169
    170
    171
    172
    173
    174
    175
    176
    177
    178
    179
    180
    181
    182
    183
    184
    185
    186
    187
    188
    189
    190
    191
    192
    193
    194
    195
    196
    <!DOCTYPE html>
    <html lang="fr" dir="ltr">
    <head>
      <meta http-equiv="cache-control" content="public, max-age=60">
      <meta charset="utf-8">
      <meta name="viewport" content="initial-scale=1.0">
      <meta name="author" content="Daniel Hagnoul">
      <title>Joueur</title>
      <style>
        td { height: 20px; width: 20px; border: 1px dotted grey; padding: 6px; }
      </style>
    </head>
    <body>
      <table id="monJeu">
        <thead>
          <tr>
            <th></th>
            <th>A</th>
            <th>B</th>
            <th>C</th>
            <th>D</th>
            <th>E</th>
            <th>F</th>
            <th>G</th>
            <th>H</th>
            <th>I</th>
            <th>J</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <th>1</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>2</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>3</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>4</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>5</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>6</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>7</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>8</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>9</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <th>10</th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
        </tbody>
      </table>
      <script>
        var
          monJeu = document.querySelector( "#monJeu" ),
          lignes = monJeu.rows,
          inaccessible = 0,
          bloque = [ 0 ], // 0 par défaut pour row TH
          joueurRow = Math.floor( Math.random() * 10 ) + 1,
          joueurCell = Math.floor( Math.random() * 10 ) + 1;
     
        // une case inacessible par ligne
        for ( var i = 1; i < 11; i++ ){
          inaccessible = Math.floor( Math.random() * 10 ) + 1
          bloque.push( inaccessible );
          lignes[ i ].cells[ inaccessible ].style.backgroundColor = 'gray';
        }
     
        // placement du joueur (fond rouge)
        while ( joueurCell === bloque[ joueurRow ] ) {
          console.log( "blocage : ", bloque[ joueurRow ] );
          joueurCell = Math.floor( Math.random() * 10 ) + 1;
        }
     
        lignes[ joueurRow ].cells[ joueurCell ].style.backgroundColor = 'red';
     
        // debug, console, touche F12
        //console.log( "lignes : ", lignes );
        //console.log( "lignes 2 cells : ", lignes[ 2 ].cells );
        //console.log( "bloque : ", bloque );
        //console.log( "joueurRow : ", joueurRow );
        //console.log( "joueurCell : ", joueurCell );
        //console.log( "bloque[ joueurRow ] : ", bloque[ joueurRow ] );
      </script>
    </body>
    </html>

    Blog

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

  4. #4
    Membre très actif
    Homme Profil pro
    rien
    Inscrit en
    Décembre 2015
    Messages
    282
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Aveyron (Midi Pyrénées)

    Informations professionnelles :
    Activité : rien

    Informations forums :
    Inscription : Décembre 2015
    Messages : 282
    Par défaut
    Citation Envoyé par armand3 Voir le message
    Bonjour, je travail sur un jeu de role où les joueur se deplacent dans un espace de 20 x 20 cases. parmi ces cases il y en a qui sont innaccessible et ont la couleur grise, elles apparaissent de facon alleatoire à chaque chargement de page, les deux joueurs aussi apparaisent de facon alleatoire, mon probleme c'est que quand je recharge à plusieur reprise mon naviguateur, le joueur se retrouve dans la meme case que la case innaccessible, or le joueur ne doit pas etre sur la case innaccessible et les joueur ne doivent pas se toucher (au chargement du naviguateur); ai ce une mauvaise condition? aidez moi.
    Salut

    Super ! DanielHalgoul
    Au fait, dans ton dernier code, les instructions de déclarations de variables se terminent par "," c'est des fautes de saisie non ?

    Armand3 : Tu devrais étudier les tableaux HTML si tu comptes faire une map de jeu du genre que tu as commencé, et pour une petite map je pense que c'est adapté, comme le super exemple qu'a fait danielHalgoul, Et pour stocker la position et les noms des joueurs sur ta map il ne faudra pas utiliser de variables simplement mais créer un tableau qui représentera ta map virtuellement et qui contiendra les variables indiquées.
    Donc il te faudra apprendre aussi le traitement des tableaux en javaScript.

  5. #5
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    Février 2009
    Messages
    6 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : Février 2009
    Messages : 6 389
    Billets dans le blog
    125
    Par défaut
    Citation Envoyé par progdebutant Voir le message
    Au fait, dans ton dernier code, les instructions de déclarations de variables se terminent par "," c'est des fautes de saisie non ?
    On peut déclarer plusieurs variables séparées par une virgule, mais on doit toujours terminer la série par un ";".

    Il faut gérer l'ordre des déclarations, car une chose peut dépendre d'une autre.

    Rassembler toutes les variables et fonctions (nom = function(){...}) dans le même "var" en tête de programme améliore les performances et la lisibilité du programme.

    Blog

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

  6. #6
    Membre très actif
    Homme Profil pro
    rien
    Inscrit en
    Décembre 2015
    Messages
    282
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Aveyron (Midi Pyrénées)

    Informations professionnelles :
    Activité : rien

    Informations forums :
    Inscription : Décembre 2015
    Messages : 282
    Par défaut
    Salut
    Mince, c'est vrai, j'avais complètement zappé ça, je m'étais fixé sur la virgule en fin d'une instruction :/
    Je savais ça pourtant, comme quoi programmer à fond surtout la nuit est contre-productif, il vaut mieux se laisser des pauses nécessaires et utiles, je suis content que tu me le rappelles de façon si précise.

Discussions similaires

  1. [HTML] Positionnement dans une page web
    Par pasqwal dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 26/10/2006, 15h53
  2. Réponses: 6
    Dernier message: 10/04/2006, 12h10
  3. Plein écran dans une page Web
    Par uron86 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 4
    Dernier message: 31/10/2005, 16h44
  4. [applet] lancer une applet mais dans une page web
    Par dzincou dans le forum Eclipse Java
    Réponses: 4
    Dernier message: 11/08/2004, 13h32
  5. Insérer un fichier dans une page web
    Par Mad666 dans le forum ASP
    Réponses: 6
    Dernier message: 05/05/2004, 11h22

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