P3 (codes des couleurs)

Contenu du snippet

Dans la plupart du temps, quand on fait un site, on commence a trouver quelque petit problème afin de trouver une couleur qui correspond bien a son site... Et bien, j'ai créer ce petit module qui fait en sorte de tester tout les possibilités disponibles afin d'avoir la bonne couleur...

Source / Exemple :


<html>
<head>
<title>P3 (Codes des couleurs)</title>
</head>
<script>
function couleur(){
digital = "0123456789abcdef";
rouge = document.couleur.c1.value;
x1 = digital.charAt(Math.floor(rouge/16));
x2 = digital.charAt(rouge%16);
rouge = x1 + x2;
vert = document.couleur.c2.value;
x1 = digital.charAt(Math.floor(vert/16));
x2 = digital.charAt(vert%16);
vert = x1 + x2;
bleu = document.couleur.c3.value;
x1 = digital.charAt(Math.floor(bleu/16));
x2 = digital.charAt(bleu%16);
bleu = x1 + x2;
commun = "#" + rouge + vert + bleu;
document.couleur.hexa.value = commun;
document.couleur.fond.style.backgroundColor = commun;
}
function changer(parent){
        if(parent=="1"){
input = document.couleur.c1;
        }else if(parent=="2"){
input = document.couleur.c2;
        }else{
input = document.couleur.c3;
        }
valeur = input.value;
        if(valeur<"0" || valeur>"255"){
valeur = "0";
        }
couleur();
}
function bouton(partie,v){
        if(v=="1"){
input = document.couleur.c1;
        }else if(v=="2"){
input = document.couleur.c2;
        }else{
input = document.couleur.c3;
        }
valeur = input.value;
        if(valeur<="0"){
valeur = "0";
        }
        if(partie=="ajouter"){
                if(valeur<="254"){
input.value++;
                }
        }else{
                if(valeur>="1"){
input.value--;
                }
        }
couleur();
}
</script>
<body>
<form name="couleur">
<b>Rouge :</b><br><input type="text" name="c1" value="0" size="2" onchange="changer('1')">&nbsp;<input type="button" value=" + " onclick="bouton('ajouter','1')" onmouseover="bouton('ajouter','1')">&nbsp;<input type="button" value=" - " onclick="bouton('enlever','1')" onmouseover="bouton('enlever','1')"><p>
<b>Vert :</b><br><input type="text" name="c2" value="0" size="2" onchange="changer('2')">&nbsp;<input type="button" value=" + " onclick="bouton('ajouter','2')" onmouseover="bouton('ajouter','2')">&nbsp;<input type="button" value=" - " onclick="bouton('enlever','2')" onmouseover="bouton('enlever','2')"><p>
<b>Bleu :</b><br><input type="text" name="c3" value="0" size="2" onchange="changer('3')">&nbsp;<input type="button" value=" + " onclick="bouton('ajouter','3')" onmouseover="bouton('ajouter','3')">&nbsp;<input type="button" value=" - " onclick="bouton('enlever','3')" onmouseover="bouton('enlever','3')"><p>
<center><input type="text" style="background-color:#000000" size="3" name="fond"><br>
<input type="text" value="#000000" name="hexa" size="6">
</form>
</body>
</html>

Conclusion :


Avoir ce type de petit prog. peut servir surtout quand on utilise un logiciel comme notepad ou vi...

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.