Retour à la liste des sujets

[JAVASCRIPT] Probleme jeu du simon

JusdEauRange25
2022-11-16 22:12:03

<!doctype html>

<html lang="fr">

    <head>

        <meta charset="utf-8">

        <title>Exo</title>

        <link href="exo.css" rel="stylesheet" type="text/css" />

        <script src="exo.js"></script>

    </head>

    <body>

        <div class="bloc">

            <div class="a">

                <div class="red" onclick="appuyer()"></div>

                <div class="green" onclick="appuyer()"></div>

            </div>

            <div class="b">

                <div class="blue" onmousedown="appuyer()"></div>

                <div class="yell" onclick="appuyer()"></div>

            </div>   

        </div> 

    </body>

</html>
.a, .b{

    display: flex;

    justify-content: center;

}



.red{

    background-color: rgb(249, 182, 182);

    width: 200px;

    height: 200px;

}



.green{

    background-color: green;

    width: 200px;

    height: 200px;

    opacity: 0.5;

}



.blue{

    background-color: blue;

    width: 200px;

    height: 200px;

    opacity: 0.5;

}



.yell{

    background-color: yellow;

    width: 200px;

    height: 200px;

    opacity: 0.5;

}
function appuyer(){

    let red = document.getElementsByClassName("red");

    let green = document.getElementsByClassName("green");

    let blue = document.getElementsByClassName("blue");

    let yell = document.getElementsByClassName("yell");



    if (red){

        document.body.style.background = red;

    }

    else if (green){

        green.style.backgroundColor = "#008000";

    }

    else if (yell){

        yell.body.style.backgroundColor = "yellow";

    }

    else{

        document.body.style.background = blue;

    }



}

ça fonctonne pas
ça doit changer de couleur quand on appuie

JusdEauRange25
2022-11-16 22:14:07

https://jsfiddle.net/#&togetherjs=P1u9IPGxIH

CyprineMaligne
2022-11-16 22:15:50

La fonction getElementsByClassName te retourne un tableau d'éléments, pas un seul élément.
Donnes plutôt un id à tes éléments de couleur, et utilises getElementById qui lui te retournera l'élément ciblé.
Si t'as la flemme, fais comme ça :
let red = document.getElementsByClassName("red")[0]; et pareil pour les autres.

JusdEauRange25
2022-11-16 22:16:35

Le 16 novembre 2022 à 22:15:50 :
La fonction getElementsByClassName te retourne un tableau d'éléments, pas un seul élément.
Donnes plutôt un id à tes éléments de couleur, et utilises getElementById qui lui te retournera l'élément ciblé.
Si t'as la flemme, fais comme ça :
let red = document.getElementsByClassName("red")[0]; et pareil pour les autres.

ah oui je vais test avec id merci

HvBeenTrumped
2022-11-16 22:19:37

Tes conditions sont à chier.

T'es une insulte au développement avec ton code de merde. Tu ne sais pas ce que tu fais. Va apprendre les bases au lieu de nous faire chier avec ton vomi qui pue la mort.

JusdEauRange25
2022-11-16 22:20:25

Le 16 novembre 2022 à 22:19:37 :
Tes conditions sont à chier.

T'es une insulte au développement avec ton code de merde. Tu ne sais pas ce que tu fais. Va apprendre les bases au lieu de nous faire chier avec ton vomi qui pue la mort.

désolé je suis débutant :rire:

HvBeenTrumped
2022-11-16 22:23:27

Le 16 novembre 2022 à 22:20:25 :

Le 16 novembre 2022 à 22:19:37 :
Tes conditions sont à chier.

T'es une insulte au développement avec ton code de merde. Tu ne sais pas ce que tu fais. Va apprendre les bases au lieu de nous faire chier avec ton vomi qui pue la mort.

désolé je suis débutant :rire:

Être débutant n'empêche pas de tester et comprendre son code.

cbonwola93
2022-11-16 22:24:13

ça devrait t'aider :

<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Exo</title>
<link href="exo.css" rel="stylesheet" type="text/css" />
<script src="exo.js"></script>
</head>
<body>
<div class="bloc">
<div class="a">
<div class="red" onclick="appuyer('red')"></div>
<div class="green" onclick="appuyer('green')"></div>
</div>
<div class="b">
<div class="blue" onmousedown="appuyer('blue')"></div>
<div class="yell" onclick="appuyer('yellow')"></div>
</div>
</div>
</body>

function appuyer(color){
document.body.style.background = color;
}

fuckLREM
2022-11-16 22:25:38

Le 16 novembre 2022 à 22:23:27 :

Le 16 novembre 2022 à 22:20:25 :

Le 16 novembre 2022 à 22:19:37 :
Tes conditions sont à chier.

T'es une insulte au développement avec ton code de merde. Tu ne sais pas ce que tu fais. Va apprendre les bases au lieu de nous faire chier avec ton vomi qui pue la mort.

désolé je suis débutant :rire:

Être débutant n'empêche pas de tester et comprendre son code.

Casse pas les couilles l’éfféminé

Enculeur_18-25
2022-11-16 22:28:58

Le 16 novembre 2022 à 22:25:38 :

Le 16 novembre 2022 à 22:23:27 :

Le 16 novembre 2022 à 22:20:25 :

Le 16 novembre 2022 à 22:19:37 :
Tes conditions sont à chier.

T'es une insulte au développement avec ton code de merde. Tu ne sais pas ce que tu fais. Va apprendre les bases au lieu de nous faire chier avec ton vomi qui pue la mort.

désolé je suis débutant :rire:

Être débutant n'empêche pas de tester et comprendre son code.

Casse pas les couilles l’éfféminé

JusdEauRange25
2022-11-16 22:45:47

Le 16 novembre 2022 à 22:24:13 :
ça devrait t'aider :

<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Exo</title>
<link href="exo.css" rel="stylesheet" type="text/css" />
<script src="exo.js"></script>
</head>
<body>
<div class="bloc">
<div class="a">
<div class="red" onclick="appuyer('red')"></div>
<div class="green" onclick="appuyer('green')"></div>
</div>
<div class="b">
<div class="blue" onmousedown="appuyer('blue')"></div>
<div class="yell" onclick="appuyer('yellow')"></div>
</div>
</div>
</body>

function appuyer(color){
document.body.style.background = color;
}

ca change la couleur de tout le background
j'ai changé les classe par des id pour recuperer chaque case

cbonwola93
2022-11-16 22:50:04

Le 16 novembre 2022 à 22:45:47 :

Le 16 novembre 2022 à 22:24:13 :
ça devrait t'aider :

<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Exo</title>
<link href="exo.css" rel="stylesheet" type="text/css" />
<script src="exo.js"></script>
</head>
<body>
<div class="bloc">
<div class="a">
<div class="red" onclick="appuyer('red')"></div>
<div class="green" onclick="appuyer('green')"></div>
</div>
<div class="b">
<div class="blue" onmousedown="appuyer('blue')"></div>
<div class="yell" onclick="appuyer('yellow')"></div>
</div>
</div>
</body>

function appuyer(color){
document.body.style.background = color;
}

ca change la couleur de tout le background
j'ai changé les classe par des id pour recuperer chaque case

J'ai écrit un exemple pour te débloquer, si je ne connais pas la consigne de départ, je ne suis pas censé savoir ce que ton code doit faire :) Concrètement, si on clique sur une case, il doit se passer quoi ?

n10tt
2022-11-16 22:51:43

fais le en haskell khey c'est beaucoup plus simple qu'avec cette purge de js !

JusdEauRange25
2022-11-16 22:54:34

Le 16 novembre 2022 à 22:50:04 :

Le 16 novembre 2022 à 22:45:47 :

Le 16 novembre 2022 à 22:24:13 :
ça devrait t'aider :

<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Exo</title>
<link href="exo.css" rel="stylesheet" type="text/css" />
<script src="exo.js"></script>
</head>
<body>
<div class="bloc">
<div class="a">
<div class="red" onclick="appuyer('red')"></div>
<div class="green" onclick="appuyer('green')"></div>
</div>
<div class="b">
<div class="blue" onmousedown="appuyer('blue')"></div>
<div class="yell" onclick="appuyer('yellow')"></div>
</div>
</div>
</body>

function appuyer(color){
document.body.style.background = color;
}

ca change la couleur de tout le background
j'ai changé les classe par des id pour recuperer chaque case

J'ai écrit un exemple pour te débloquer, si je ne connais pas la consigne de départ, je ne suis pas censé savoir ce que ton code doit faire :) Concrètement, si on clique sur une case, il doit se passer quoi ?

la case doit changer de couleur
au lieu de changer de couleur j'ai mis opacity 0.5

cbonwola93
2022-11-16 23:01:58

Le 16 novembre 2022 à 22:54:34 :

Le 16 novembre 2022 à 22:50:04 :

Le 16 novembre 2022 à 22:45:47 :

Le 16 novembre 2022 à 22:24:13 :
ça devrait t'aider :

<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Exo</title>
<link href="exo.css" rel="stylesheet" type="text/css" />
<script src="exo.js"></script>
</head>
<body>
<div class="bloc">
<div class="a">
<div class="red" onclick="appuyer('red')"></div>
<div class="green" onclick="appuyer('green')"></div>
</div>
<div class="b">
<div class="blue" onmousedown="appuyer('blue')"></div>
<div class="yell" onclick="appuyer('yellow')"></div>
</div>
</div>
</body>

function appuyer(color){
document.body.style.background = color;
}

ca change la couleur de tout le background
j'ai changé les classe par des id pour recuperer chaque case

J'ai écrit un exemple pour te débloquer, si je ne connais pas la consigne de départ, je ne suis pas censé savoir ce que ton code doit faire :) Concrètement, si on clique sur une case, il doit se passer quoi ?

la case doit changer de couleur
au lieu de changer de couleur j'ai mis opacity 0.5

Ba c'est simple, tu mets un id sur chaque div et ensuite tu le passe cet id dans la fonction
document.getElementById(ton id).style.background = la couleur que tu veux

JusdEauRange25
2022-11-16 23:03:21

Le 16 novembre 2022 à 23:01:58 :

Le 16 novembre 2022 à 22:54:34 :

Le 16 novembre 2022 à 22:50:04 :

Le 16 novembre 2022 à 22:45:47 :

Le 16 novembre 2022 à 22:24:13 :
ça devrait t'aider :

<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Exo</title>
<link href="exo.css" rel="stylesheet" type="text/css" />
<script src="exo.js"></script>
</head>
<body>
<div class="bloc">
<div class="a">
<div class="red" onclick="appuyer('red')"></div>
<div class="green" onclick="appuyer('green')"></div>
</div>
<div class="b">
<div class="blue" onmousedown="appuyer('blue')"></div>
<div class="yell" onclick="appuyer('yellow')"></div>
</div>
</div>
</body>

function appuyer(color){
document.body.style.background = color;
}

ca change la couleur de tout le background
j'ai changé les classe par des id pour recuperer chaque case

J'ai écrit un exemple pour te débloquer, si je ne connais pas la consigne de départ, je ne suis pas censé savoir ce que ton code doit faire :) Concrètement, si on clique sur une case, il doit se passer quoi ?

la case doit changer de couleur
au lieu de changer de couleur j'ai mis opacity 0.5

Ba c'est simple, tu mets un id sur chaque div et ensuite tu le passe cet id dans la fonction
document.getElementById(ton id).style.background = la couleur que tu veux

oui mais chaque case a un id different

cbonwola93
2022-11-16 23:04:19

Le 16 novembre 2022 à 23:03:21 :

Le 16 novembre 2022 à 23:01:58 :

Le 16 novembre 2022 à 22:54:34 :

Le 16 novembre 2022 à 22:50:04 :

Le 16 novembre 2022 à 22:45:47 :

Le 16 novembre 2022 à 22:24:13 :
ça devrait t'aider :

<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Exo</title>
<link href="exo.css" rel="stylesheet" type="text/css" />
<script src="exo.js"></script>
</head>
<body>
<div class="bloc">
<div class="a">
<div class="red" onclick="appuyer('red')"></div>
<div class="green" onclick="appuyer('green')"></div>
</div>
<div class="b">
<div class="blue" onmousedown="appuyer('blue')"></div>
<div class="yell" onclick="appuyer('yellow')"></div>
</div>
</div>
</body>

function appuyer(color){
document.body.style.background = color;
}

ca change la couleur de tout le background
j'ai changé les classe par des id pour recuperer chaque case

J'ai écrit un exemple pour te débloquer, si je ne connais pas la consigne de départ, je ne suis pas censé savoir ce que ton code doit faire :) Concrètement, si on clique sur une case, il doit se passer quoi ?

la case doit changer de couleur
au lieu de changer de couleur j'ai mis opacity 0.5

Ba c'est simple, tu mets un id sur chaque div et ensuite tu le passe cet id dans la fonction
document.getElementById(ton id).style.background = la couleur que tu veux

oui mais chaque case a un id different

Bien évidemment

JusdEauRange25
2022-11-16 23:08:44

Le 16 novembre 2022 à 23:04:19 :

Le 16 novembre 2022 à 23:03:21 :

Le 16 novembre 2022 à 23:01:58 :

Le 16 novembre 2022 à 22:54:34 :

Le 16 novembre 2022 à 22:50:04 :

Le 16 novembre 2022 à 22:45:47 :

Le 16 novembre 2022 à 22:24:13 :
ça devrait t'aider :

<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Exo</title>
<link href="exo.css" rel="stylesheet" type="text/css" />
<script src="exo.js"></script>
</head>
<body>
<div class="bloc">
<div class="a">
<div class="red" onclick="appuyer('red')"></div>
<div class="green" onclick="appuyer('green')"></div>
</div>
<div class="b">
<div class="blue" onmousedown="appuyer('blue')"></div>
<div class="yell" onclick="appuyer('yellow')"></div>
</div>
</div>
</body>

function appuyer(color){
document.body.style.background = color;
}

ca change la couleur de tout le background
j'ai changé les classe par des id pour recuperer chaque case

J'ai écrit un exemple pour te débloquer, si je ne connais pas la consigne de départ, je ne suis pas censé savoir ce que ton code doit faire :) Concrètement, si on clique sur une case, il doit se passer quoi ?

la case doit changer de couleur
au lieu de changer de couleur j'ai mis opacity 0.5

Ba c'est simple, tu mets un id sur chaque div et ensuite tu le passe cet id dans la fonction
document.getElementById(ton id).style.background = la couleur que tu veux

oui mais chaque case a un id different

Bien évidemment

function appuyer(color){

  let red = document.getElementById(red);

   let green = document.getElementById(green);

   let blue = document.getElementById(blue);

   let yellow = document.getElementById(yellow);

  

  if (color == red){

        red.style.background = "red";

    }

    else if (color == green){

        green.style.backgroundColor = "#008000";

    }

    if (color == yellow){

        yell.body.style.backgroundColor = "yellow";

    }

    else{

        blue.style.background = "blue";

    }

}

JusdEauRange25
2022-11-16 23:13:59

up

HvBeenTrumped
2022-11-17 07:16:42

:rire: t'es tellement nul tu comprends rien

Infos
Gestion du forum
contact@geevey.com

API disponible. Utilisez le paramètre "api" en GET, peu importe le contenu, sur une page du site.
Notes
    Partenaire: JVFlux
    Ce site n'est pas associé à Jeuxvideo.com ou Webedia. Nous utilisons seulement des archives publiques.
    Il est inutile de me spammer par e-mail pour supprimer un topic. Au contraire, en conséquence, je mettrais votre topic dans le bloc ci-dessous.
Non-assumage
    Personne n'a pas assumé de topic pour le moment.