Probleme java-script rgb vers hexadecimal

momo9213 -  
 momo9213 -
Bonjour,
je rencontre un problème avec un code java-script.
Le but de monde code qui est composé en 3 fichiers est de créer un site qui permet d'obtenir la couleur demande en fonction des trois couleurs Rouge Vert Bleu et d'obtenir la valeur en hexadécimal.
Le problème que je rencontre et la conversion du rgb vers l'hexadécimal
merci pour ce qui essayeront de m'aider 
let valeur_rouge = 0;
let zoneRouge = document.getElementById("chiffre_rouge");

function fct_saisie_valeur_rouge(){
  if (isNaN(saisie_rouge.value)) {
      alert("Veuillez ecrire un nombre");
   } else {
       valeur_rouge = parseInt(saisie_rouge.value,10);
       zoneRouge.innerHTML = valeur_rouge;
       fct_change_couleur();
   }
   if (valeur_rouge > 255){
    alert("vous ne pouvez que entrer des nombre de 0 à 255");
    valeur_rouge = 255 ;
    zoneRouge.innerHTML = valeur_rouge;
   }
   if (valeur_rouge < 0){
    alert("vous ne pouvez que entrer des nombre de 0 à 255");
    valeur_rouge = 0 ;
    zoneRouge.innerHTML = valeur_rouge;
   }
}
let saisie_rouge = document.getElementById("text_rouge");
saisie_rouge.addEventListener("change",fct_saisie_valeur_rouge);


function augmentation_rouge(){
    valeur_rouge = valeur_rouge + 1;
    zoneRouge.innerHTML = valeur_rouge;
    if (valeur_rouge > 255){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_rouge = 255 ;
    }
     zoneRouge.innerHTML = valeur_rouge;
    fct_change_couleur();
  }
 let bouton_rouge_plus = document.getElementById("rouge+");
 bouton_rouge_plus.addEventListener("click",augmentation_rouge);

 
 function diminution_rouge(){
    valeur_rouge = valeur_rouge - 1;
    zoneRouge.innerHTML = valeur_rouge;
    if (valeur_rouge < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_rouge = 0 ;
    }
     zoneRouge.innerHTML = valeur_rouge;
    fct_change_couleur();
  }
 let bouton_rouge_moins = document.getElementById("rouge-");
 bouton_rouge_moins.addEventListener("click",diminution_rouge,);
let boite_coloree = document.getElementById("boite_couleur")


function fct_change_couleur(){
    debutRVB = "rgb(" ;
 codeRVB = debutRVB.concat(valeur_rouge,",",valeur_vert,",",valeur_bleu,")");
 boite_coloree.style.backgroundColor = codeRVB;
}

let valeur_vert = 0;
let zoneVert = document.getElementById("chiffre_vert");

function fct_saisie_valeur_vert(){
    if (isNaN(saisie_vert.value)) {
        alert("Veuillez ecrire un nombre");
     } else {
         valeur_vert = parseInt(saisie_vert.value,10);
         zoneVert.innerHTML = valeur_vert;
         fct_change_couleur();
     }
     if (valeur_vert > 255){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_vert = 255 ;
      zoneVert.innerHTML = valeur_vert;
     }
     if (valeur_vert < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_vert = 0 ;
      zoneVert.innerHTML = valeur_vert;
     }
  }


  let saisie_vert = document.getElementById("text_vert");
  saisie_vert.addEventListener("change",fct_saisie_valeur_vert)
  
  function augmentation_vert(){
      valeur_vert = valeur_vert + 1;
      zoneVert.innerHTML = valeur_vert;
      if (valeur_vert > 255){
        alert("vous ne pouvez que entrer des nombre de 0 à 255");
        valeur_vert = 255 ;
      }
       zoneVert.innerHTML = valeur_vert;
      fct_change_couleur();
    }
   let bouton_vert_plus = document.getElementById("vert+");
   bouton_vert_plus.addEventListener("click",augmentation_vert);
  
  

  function diminution_vert(){

    valeur_vert = valeur_vert - 1;
    zoneVert.innerHTML = valeur_vert;
    if (valeur_vert < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_vert = 0 ;
    }
     zoneVert.innerHTML = valeur_vert;
     fct_change_couleur();
    }
  let bouton_vert_moins = document.getElementById("vert-");
  bouton_vert_moins.addEventListener("click",diminution_vert);


let valeur_bleu = 0;
let zoneBleu = document.getElementById("chiffre_bleu");

function fct_saisie_valeur_bleu(){
    if (isNaN(saisie_bleu.value)) {
        alert("Veuillez ecrire un nombre");
     } else {
         valeur_bleu = parseInt(saisie_bleu.value,10);
         zoneBleu.innerHTML = valeur_bleu;
         fct_change_couleur();
     }
     if (valeur_bleu > 255){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_bleu = 255 ;
      zoneBleu.innerHTML = valeur_bleu;
     }
     if (valeur_bleu < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_bleu = 0 ;
      zoneBleu.innerHTML = valeur_bleu;
     }
  }


let saisie_bleu = document.getElementById("text_bleu");
saisie_bleu.addEventListener("change",fct_saisie_valeur_bleu)
  
  function augmentation_bleu(){
      valeur_bleu = valeur_bleu + 1;
      zoneBleu.innerHTML = valeur_bleu;
      if (valeur_bleu > 255){
        alert("vous ne pouvez que entrer des nombre de 0 à 255");
        valeur_bleu = 255 ;
      }
       zoneBleu.innerHTML = valeur_bleu;
       fct_change_couleur();
      }
   let bouton_bleu_plus = document.getElementById("bleu+");
   bouton_bleu_plus.addEventListener("click",augmentation_bleu);
  
   
  function diminution_bleu(){

    valeur_bleu = valeur_bleu - 1;
    zoneBleu.innerHTML = valeur_bleu;
    if (valeur_bleu < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_bleu = 0 ;
    }
     zoneBleu.innerHTML = valeur_bleu;
     fct_change_couleur();
    }
  let bouton_bleu_moins = document.getElementById("bleu-");
  bouton_bleu_moins.addEventListener("click",diminution_bleu);
  document.body.style.backgroundColor = "rgb(164,191,209)";

   let valeur_Hexa_Hexadecimale_rouge = zoneRouge.toString(16); 
   let valeur_Hexa_Decimale = document.getElementById("valeur");   


<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Mélangeur</title>
<link rel="stylesheet" href="stylecss.css" type="text/css">
<link rel="stylesheet"href="boite_couleur.css">
<script src="massi.js" async></script>
</head>
<body>
    <h1>Mélangeur de couleur</h1>
    <p1>Entrez les valeur dans champ de saisie:</p1>
    </br>
    <p2>R: <input id="text_rouge" type="text"/><button id="rouge+">+</button> <button id="rouge-">-</button>  
    → <span id="chiffre_rouge">0</span></p2>
    </br>
    <p3>V: <input id="text_vert" type="text"/><button id="vert+">+</button> <button id="vert-">-</button>
        → <span id="chiffre_vert">0</span></p3>
    </br>
    <p4>B: <input id="text_bleu" type="text"/><button id="bleu+">+</button> <button id="bleu-">-</button>
        → <span id="chiffre_bleu">0</span></p4>    
    </br>
    <p1> Le code couleur Hexadécimal résultant:#<span id="valeur">FFFFF</span></p1>
    </br>
    <div id="boite_couleur"></div>

</body>
</html>

#boite_couleur {
 background-color : white;
    height : 100px;
 width : 300px;
    border: 3px black solid;
}


EDIT : Ajout des balises de code (la coloration syntaxique).
Explications disponibles ici : ICI

Merci d'y penser dans tes prochains messages.
A voir également:

2 réponses

Réponse 1 / 2
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
Bonjour,

La fin de ton JS ne se trouvant pas dans une fonction.. n'est appelé qu'une seule fois à l'ouverture de ta page....
Si tu veux que ça se réactualise lorsque tu modifies les couleurs.. il faut les mettre dans une fonction et y faire appel dans tes autres fonctions...
0
momo9213
 
merci d avoir répondu a ma question.
J'ai donc essaye ce que vous m avez dis mais ca ne marche pas je vous mets le code ci-dessous et merci encore 
let valeur_rouge = 0;
let zoneRouge = document.getElementById("chiffre_rouge");

function fct_saisie_valeur_rouge(){
  if (isNaN(saisie_rouge.value)) {
      alert("Veuillez ecrire un nombre");
   } else {
       valeur_rouge = parseInt(saisie_rouge.value,10);
       zoneRouge.innerHTML = valeur_rouge;
       fct_change_couleur();
   }
   if (valeur_rouge > 255){
    alert("vous ne pouvez que entrer des nombre de 0 à 255");
    valeur_rouge = 255 ;
    zoneRouge.innerHTML = valeur_rouge;
   }
   if (valeur_rouge < 0){
    alert("vous ne pouvez que entrer des nombre de 0 à 255");
    valeur_rouge = 0 ;
    zoneRouge.innerHTML = valeur_rouge;
   }
}
let saisie_rouge = document.getElementById("text_rouge");
saisie_rouge.addEventListener("change",fct_saisie_valeur_rouge,change_hexa);


function augmentation_rouge(){
    valeur_rouge = valeur_rouge + 1;
    zoneRouge.innerHTML = valeur_rouge;
    if (valeur_rouge > 255){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_rouge = 255 ;
    }
     zoneRouge.innerHTML = valeur_rouge;
    fct_change_couleur();
  }
 let bouton_rouge_plus = document.getElementById("rouge+");
 bouton_rouge_plus.addEventListener("click",augmentation_rouge,change_hexa);

 
 function diminution_rouge(){
    valeur_rouge = valeur_rouge - 1;
    zoneRouge.innerHTML = valeur_rouge;
    if (valeur_rouge < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_rouge = 0 ;
    }
     zoneRouge.innerHTML = valeur_rouge;
    fct_change_couleur();
  }
 let bouton_rouge_moins = document.getElementById("rouge-");
 bouton_rouge_moins.addEventListener("click",diminution_rouge,change_hexa);
let boite_coloree = document.getElementById("boite_couleur")


function fct_change_couleur(){
    debutRVB = "rgb(" ;
 codeRVB = debutRVB.concat(valeur_rouge,",",valeur_vert,",",valeur_bleu,")");
 boite_coloree.style.backgroundColor = codeRVB;
}

let valeur_vert = 0;
let zoneVert = document.getElementById("chiffre_vert");

function fct_saisie_valeur_vert(){
    if (isNaN(saisie_vert.value)) {
        alert("Veuillez ecrire un nombre");
     } else {
         valeur_vert = parseInt(saisie_vert.value,10);
         zoneVert.innerHTML = valeur_vert;
         fct_change_couleur();
     }
     if (valeur_vert > 255){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_vert = 255 ;
      zoneVert.innerHTML = valeur_vert;
     }
     if (valeur_vert < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_vert = 0 ;
      zoneVert.innerHTML = valeur_vert;
     }
  }


  let saisie_vert = document.getElementById("text_vert");
  saisie_vert.addEventListener("change",fct_saisie_valeur_vert,change_hexa)
  
  function augmentation_vert(){
      valeur_vert = valeur_vert + 1;
      zoneVert.innerHTML = valeur_vert;
      if (valeur_vert > 255){
        alert("vous ne pouvez que entrer des nombre de 0 à 255");
        valeur_vert = 255 ;
      }
       zoneVert.innerHTML = valeur_vert;
      fct_change_couleur();
    }
   let bouton_vert_plus = document.getElementById("vert+");
   bouton_vert_plus.addEventListener("click",augmentation_vert,change_hexa);
  
  

  function diminution_vert(){

    valeur_vert = valeur_vert - 1;
    zoneVert.innerHTML = valeur_vert;
    if (valeur_vert < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_vert = 0 ;
    }
     zoneVert.innerHTML = valeur_vert;
     fct_change_couleur();
    }
  let bouton_vert_moins = document.getElementById("vert-");
  bouton_vert_moins.addEventListener("click",diminution_vert,change_hexa);


let valeur_bleu = 0;
let zoneBleu = document.getElementById("chiffre_bleu");

function fct_saisie_valeur_bleu(){
    if (isNaN(saisie_bleu.value)) {
        alert("Veuillez ecrire un nombre");
     } else {
         valeur_bleu = parseInt(saisie_bleu.value,10);
         zoneBleu.innerHTML = valeur_bleu;
         fct_change_couleur();
     }
     if (valeur_bleu > 255){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_bleu = 255 ;
      zoneBleu.innerHTML = valeur_bleu;
     }
     if (valeur_bleu < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_bleu = 0 ;
      zoneBleu.innerHTML = valeur_bleu;
     }
  }


let saisie_bleu = document.getElementById("text_bleu");
saisie_bleu.addEventListener("change",fct_saisie_valeur_bleu,change_hexa)
  
  function augmentation_bleu(){
      valeur_bleu = valeur_bleu + 1;
      zoneBleu.innerHTML = valeur_bleu;
      if (valeur_bleu > 255){
        alert("vous ne pouvez que entrer des nombre de 0 à 255");
        valeur_bleu = 255 ;
      }
       zoneBleu.innerHTML = valeur_bleu;
       fct_change_couleur();
      }
   let bouton_bleu_plus = document.getElementById("bleu+");
   bouton_bleu_plus.addEventListener("click",augmentation_bleu,change_hexa);
  
   
  function diminution_bleu(){

    valeur_bleu = valeur_bleu - 1;
    zoneBleu.innerHTML = valeur_bleu;
    if (valeur_bleu < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_bleu = 0 ;
    }
     zoneBleu.innerHTML = valeur_bleu;
     fct_change_couleur();
    }
  let bouton_bleu_moins = document.getElementById("bleu-");
  bouton_bleu_moins.addEventListener("click",diminution_bleu);
  document.body.style.backgroundColor = "rgb(164,191,209)";
  function change_hexa(){
   let valeur_Hexa_Decimale_rouge = zoneRouge.toString(16); 
   let valeur_Hexa_Decimale_vert = zoneVert.toString(16); 
   let valeur_Hexa_Decimale_bleu = zoneBleu.toString(16); 
   let valeur_Hexa_Decimale = document.getElementById("valeur");   
   valeur_Hexa_Decimale = valeur_Hexa_Decimale_rouge + valeur_Hexa_Decimale_vert + valeur_Hexa_Decimale_bleu;
  }


Message modifié par la modération
Pour une lecture plus facile du code, à l'avenir utilisez les balises, VOIR CETTE PAGE
0
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752 > momo9213
 
Bonjour
Vérifie la syntaxe de la méthode addEventListener...
Ta façon d'y appeler deux fonctions me semble étrange...
0
momo9213 > jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention  
 
Bonjour
Je ne voit pas comment corrige le problème a part peut etre mettre 2 assEventListener
0
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752 > momo9213
 
Ou.... mettre les appels dans une fonction anonyme ..
par exemple 
saisie_rouge.addEventListener("change",function(){
  fct_saisie_valeur_rouge();
   change_hexa();
});

ou mieux ...
faire une fonction qui lancera les deux 
function rouge(){
  fct_saisie_valeur_rouge();
   change_hexa();
}

et l'appeler dans ton addEventListener 
saisie_rouge.addEventListener("change",rouge);


Au passage .. plutot que de répéter 3 fois chacune de tes fonctions (fct_saisie_valeur_rouge();, fct_saisie_valeur_bleu(), fct_saisie_valeur_vert() ) dans ton code .. tu aurais mieux fait de faire une fonction dans laquelle tu passes en paramètre la couleur concernée.... un truc du genre : fct_saisie_valeur('rouge')
=> Idem pour tes fonctions d'augmentation/diminution ...
0
momo9213 > jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention  
 
j'ai essaye comme la meilleur méthode que vous m'avez conseillez mais ca ne marche point 

let valeur_rouge = 0;
let zoneRouge = document.getElementById("chiffre_rouge");

function fct_saisie_valeur_rouge(){
  if (isNaN(saisie_rouge.value)) {
      alert("Veuillez ecrire un nombre");
   } else {
       valeur_rouge = parseInt(saisie_rouge.value,10);
       zoneRouge.innerHTML = valeur_rouge;
       fct_change_couleur();
   }
   if (valeur_rouge > 255){
    alert("vous ne pouvez que entrer des nombre de 0 à 255");
    valeur_rouge = 255 ;
    zoneRouge.innerHTML = valeur_rouge;
   }
   if (valeur_rouge < 0){
    alert("vous ne pouvez que entrer des nombre de 0 à 255");
    valeur_rouge = 0 ;
    zoneRouge.innerHTML = valeur_rouge;
   }
}
let saisie_rouge = document.getElementById("text_rouge");
saisie_rouge.addEventListener("change",fct_saisie_valeur_rouge);


function augmentation_rouge(){
    valeur_rouge = valeur_rouge + 1;
    zoneRouge.innerHTML = valeur_rouge;
    if (valeur_rouge > 255){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_rouge = 255 ;
    }
     zoneRouge.innerHTML = valeur_rouge;
    fct_change_couleur();
  }
 let bouton_rouge_plus = document.getElementById("rouge+");
 bouton_rouge_plus.addEventListener("click",augmentation_rouge,change_hexa);

 
 function diminution_rouge(){
    valeur_rouge = valeur_rouge - 1;
    zoneRouge.innerHTML = valeur_rouge;
    if (valeur_rouge < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_rouge = 0 ;
    }
     zoneRouge.innerHTML = valeur_rouge;
    fct_change_couleur();
  }
 let bouton_rouge_moins = document.getElementById("rouge-");
 bouton_rouge_moins.addEventListener("click",diminution_rouge,change_hexa);
let boite_coloree = document.getElementById("boite_couleur")


function fct_change_couleur(){
    debutRVB = "rgb(" ;
 codeRVB = debutRVB.concat(valeur_rouge,",",valeur_vert,",",valeur_bleu,")");
 boite_coloree.style.backgroundColor = codeRVB;
}

let valeur_vert = 0;
let zoneVert = document.getElementById("chiffre_vert");

function fct_saisie_valeur_vert(){
    if (isNaN(saisie_vert.value)) {
        alert("Veuillez ecrire un nombre");
     } else {
         valeur_vert = parseInt(saisie_vert.value,10);
         zoneVert.innerHTML = valeur_vert;
         fct_change_couleur();
     }
     if (valeur_vert > 255){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_vert = 255 ;
      zoneVert.innerHTML = valeur_vert;
     }
     if (valeur_vert < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_vert = 0 ;
      zoneVert.innerHTML = valeur_vert;
     }
  }


  let saisie_vert = document.getElementById("text_vert");
  saisie_vert.addEventListener("change",fct_saisie_valeur_vert,change_hexa)
  
  function augmentation_vert(){
      valeur_vert = valeur_vert + 1;
      zoneVert.innerHTML = valeur_vert;
      if (valeur_vert > 255){
        alert("vous ne pouvez que entrer des nombre de 0 à 255");
        valeur_vert = 255 ;
      }
       zoneVert.innerHTML = valeur_vert;
      fct_change_couleur();
    }
   let bouton_vert_plus = document.getElementById("vert+");
   bouton_vert_plus.addEventListener("click",augmentation_vert,change_hexa);
  
  

  function diminution_vert(){

    valeur_vert = valeur_vert - 1;
    zoneVert.innerHTML = valeur_vert;
    if (valeur_vert < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_vert = 0 ;
    }
     zoneVert.innerHTML = valeur_vert;
     fct_change_couleur();
    }
  let bouton_vert_moins = document.getElementById("vert-");
  bouton_vert_moins.addEventListener("click",diminution_vert,change_hexa);


let valeur_bleu = 0;
let zoneBleu = document.getElementById("chiffre_bleu");

function fct_saisie_valeur_bleu(){
    if (isNaN(saisie_bleu.value)) {
        alert("Veuillez ecrire un nombre");
     } else {
         valeur_bleu = parseInt(saisie_bleu.value,10);
         zoneBleu.innerHTML = valeur_bleu;
         fct_change_couleur();
     }
     if (valeur_bleu > 255){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_bleu = 255 ;
      zoneBleu.innerHTML = valeur_bleu;
     }
     if (valeur_bleu < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_bleu = 0 ;
      zoneBleu.innerHTML = valeur_bleu;
     }
  }


let saisie_bleu = document.getElementById("text_bleu");
saisie_bleu.addEventListener("change",fct_saisie_valeur_bleu,change_hexa)
  
  function augmentation_bleu(){
      valeur_bleu = valeur_bleu + 1;
      zoneBleu.innerHTML = valeur_bleu;
      if (valeur_bleu > 255){
        alert("vous ne pouvez que entrer des nombre de 0 à 255");
        valeur_bleu = 255 ;
      }
       zoneBleu.innerHTML = valeur_bleu;
       fct_change_couleur();
      }
   let bouton_bleu_plus = document.getElementById("bleu+");
   bouton_bleu_plus.addEventListener("click",augmentation_bleu,change_hexa);
  
   
  function diminution_bleu(){

    valeur_bleu = valeur_bleu - 1;
    zoneBleu.innerHTML = valeur_bleu;
    if (valeur_bleu < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_bleu = 0 ;
    }
     zoneBleu.innerHTML = valeur_bleu;
     fct_change_couleur();
    }
  let bouton_bleu_moins = document.getElementById("bleu-");
  bouton_bleu_moins.addEventListener("click",diminution_bleu);
  document.body.style.backgroundColor = "rgb(164,191,209)";
  function change_hexa(){
   let valeur_Hexa_Decimale_rouge = zoneRouge.toString(16); 
   let valeur_Hexa_Decimale_vert = zoneVert.toString(16); 
   let valeur_Hexa_Decimale_bleu = zoneBleu.toString(16); 
   let valeur_Hexa_Decimale = document.getElementById("valeur");   
   valeur_Hexa_Decimale = valeur_Hexa_Decimale_rouge + valeur_Hexa_Decimale_vert + valeur_Hexa_Decimale_bleu;
  }

  function rouge(){
    fct_saisie_valeur_rouge();
     change_hexa();
  }
  saisie_rouge.addEventListener("change",rouge);
0
Réponse 2 / 2
momo9213
 
je pense avoir enfin compris
(j'ai du redécoupe mon code ca c'était le bazar )
et je suis très proche de la fin car il ne reste plus qu'à convertir en hexadécimal mais je ne comprend toujours pas mon erreur (celle de la conversion du décimal vers l hexadécimal)
et je vous remercie encore pour tout votre aide 
document.body.style.backgroundColor = "rgb(164,191,209)";
let valeur_rouge = 0;
let zoneRouge = document.getElementById("chiffre_rouge");

function fct_saisie_valeur_rouge(){
  if (isNaN(saisie_rouge.value)) {
      alert("Veuillez ecrire un nombre");
   } else {
       valeur_rouge = parseInt(saisie_rouge.value,10);
       zoneRouge.innerHTML = valeur_rouge;
       fct_change_couleur();
   }
   if (valeur_rouge > 255){
    alert("vous ne pouvez que entrer des nombre de 0 à 255");
    valeur_rouge = 255 ;
    zoneRouge.innerHTML = valeur_rouge;
   }
   if (valeur_rouge < 0){
    alert("vous ne pouvez que entrer des nombre de 0 à 255");
    valeur_rouge = 0 ;
    zoneRouge.innerHTML = valeur_rouge;
   }
}
let saisie_rouge = document.getElementById("text_rouge");
saisie_rouge.addEventListener("change",rouge);



function augmentation_rouge(){
    valeur_rouge = valeur_rouge + 1;
    zoneRouge.innerHTML = valeur_rouge;
    if (valeur_rouge > 255){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_rouge = 255 ;
    }
     zoneRouge.innerHTML = valeur_rouge;
    fct_change_couleur();
  }
 let bouton_rouge_plus = document.getElementById("rouge+");
 bouton_rouge_plus.addEventListener("click",augmentation_rouge);

 
 function diminution_rouge(){
    valeur_rouge = valeur_rouge - 1;
    zoneRouge.innerHTML = valeur_rouge;
    if (valeur_rouge < 0){
      alert("vous ne pouvez que entrer des nombre de 0 à 255");
      valeur_rouge = 0 ;
    }
     zoneRouge.innerHTML = valeur_rouge;
    fct_change_couleur();
  }
 let bouton_rouge_moins = document.getElementById("rouge-");
 bouton_rouge_moins.addEventListener("click",diminution_rouge);
let boite_coloree = document.getElementById("boite_couleur")


function fct_change_couleur(){
    debutRVB = "rgb(" ;
 codeRVB = debutRVB.concat(valeur_rouge,",0",",0)");
 boite_coloree.style.backgroundColor = codeRVB;
}



function change_hexa(){
    let valeur_Decimale_rouge = zoneRouge.innerHTML;
    let valeur_Hexa_Decimale = document.getElementById("valeur");   
    valeur_Hexa_Decimale.innerHTML = valeur_Decimale_rouge.toString(16).padStart(2,"0") ;
   }
   valeur_Hexa_Decimale.addEventListener("change",change_hexa);
 
   function rouge(){
     fct_saisie_valeur_rouge();
      change_hexa();
   }
   saisie_rouge.addEventListener("change",rouge);
0

Discussions similaires

Jeux pour itel 5330
yewou -
MPMP10 -

1 réponse
Java : Jeux gratuits à télécharger !
undertaker3 -
neogenesis -

1 réponse
application JAVA sur telephone portable !!!!
julio -
lehon kabre -

43 réponses