Carré change de couleur

Fermé
Sacha - 17 janv. 2017 à 20:10
 Sacha - 17 janv. 2017 à 20:11
Bonjour à tous voilà j'ai un problème j'ai une fonction de compte à rebours relié à une fonction qui choisit des nombres aléatoirement entre 2 et 10 en faite elle choisit le temps du compte à rebours. Ensuite sur ma page HTML j'ai un carré de couleur rouge et je voudrais que a la fin du compte à rebours ce carré change de couleur en devenant vert j'ai la fonction qui permet le changement de coueur mais le problème est que quand je clique sur le bouton start tous disparait et le chrono apparait or je voudrais que tous reste et que l'on ne voit pas le chrono.
Voici si dessous les codes:
Html:
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8" />
<!-- Fichier Fonction Changement couleur Carré -->
<script src=""quot;FonctionCarréChangeCouleur.js"></script>
<script src=""quot;Chrono.js"></script>
<script src=""quot;FonctionAléatoire.js"></script>
<!-- Fichier CSS carré -->
<link rel="stylesheet" type="text/css" href="carré.css">
<!-- Titre de l'onglet -->
<title>1er</title>
</head>
<body>
<script src=""quot;Chrono.js"></script>
<form>
<!-- Affichage du Carré Rouge -->
<span id="carre" class="color-sample" ></span>
<input id="start" type="button" onclick="count(getRandomIntInclusive(10));" value="Start" >
</form>
</body>
</html>

Javascript:
Aléatoire:
function getRandomIntInclusive(max, min) {
min = (typeof +min == "number" && min > 1) ? parseInt(min) : 2;
max = (typeof +max == "number" && parseInt(max) > min) ? parseInt(max) : min+1;
return Math.floor(Math.random() * (max - min + 1)) + min;
}

Chrono:
function count(n, el){
n = (typeof +n == "number" && n > -1) ? parseInt(n) : 60;
parentScript = [].slice.call(document.getElementsByTagName('script')).pop().parentNode;
el = (typeof el == "object") ? el : ((typeof parentScript != undefined) ? parentScript : {});
el.innerText = n--;
if (n > -1) setTimeout(function(){ count(n, el); }, 1000);
if (n == 0) { changeCC() }
}

Changement Couleur:
function changeCC() {
document.getElementById("carre").style.backgroundColor="green";
};


Voilà merci d'avance !!

1 réponse

Ah oui et voila aussi le fichier css:
.color-sample {
display: block;
width: 250px;
height: 250px;
cursor: pointer;
background-color: red;
margin-left: 250px
}
0