Rechercher : dans
Par :

1 programme pour bien choisir les couleurs

Dernière réponse le 12 jui 2009 à 21:20:57 TOTO ARC EN CIEL, le 12 jui 2009 à 19:06:22 
 Signaler ce message aux modérateurs

Bonjour,

Je croyais être venu à bout d'un petit logiciel en javascript de réalisation automatique de jeux couleurs et là je sèche complètement car après quelques modifs ça ne marche ni sur IE, ni sur FF. Quelqu'un peut m'aider ?

ci dessous le code :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>

<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">

<TITLE>C O U L E U R S</TITLE>

<script language="javascript">

function go() {
var tei = document.choix.teinte.value ;
var angl = document.choix.delta.value ;

for (i=1 ; i<7 ; i++) {

var ident = document.getElementById(i) ;

if (i=1) { var te = tei; } ;
else if (i=2) { var te = tei + angl ; if ( te > 360 ) {var te = tei + angl - 360 ; } ; } ;
else if (i=3) { var te = tei - angl ; if ( te < 0 ) {var te = tei - angl + 360 ; } ; } ;
else if (i=4) { var te = tei + 180 ; if ( te > 360 ) {var te = tei + 180 - 360 ; } ; } ;
else if (i=5) { var te = tei + angl + 180 ; if ( te > 360 ) {var te = tei + angl + 180 - 360 ; } ; } ;
else if (i=6) { var te = tei - angl + 180 ; if ( te > 360 ) {var te = tei - angl + 180 - 360 ; } ; } ;

var t = te * 255 / 60 ;

if (te < 60) {
var r = 255 ;
var v = t ;
var b = 0 ;
} ;

else if (te >= 60 && te < 120) {
var r = - t + 510 ;
var v = 255 ;
var b = 0 ;
} ;

else if (te >= 120 && te < 180) {
var r = 0 ;
var v = 255 ;
var b = t - 510 ;
} ;

else if (te >= 180 && te < 240) {
var r = 0 ;
var v = - t + 1020 ;
var b = 255 ;
} ;

else if (te >= 240 && te < 300) {
var r = t - 1020 ;
var v = 0 ;
var b = 255 ;
} ;

else if (te >= 300) {
var r = 255 ;
var v = 0 ;
var b = - t + 1530 ;
} ;

ident.style.backgroundColor = "rgb(" + r + "," + v + "," + b + ")" ; } ; }

</script>

</HEAD>
<BODY style="BACKGROUND-COLOR :#2E2E2E;text-align: left">
<TABLE style="WIDTH: 100%; HEIGHT: 100%" border=0 cellSpacing=0 cellPadding=0>
<TR>
<TD style="vertical-align: middle;">

<div style="padding-left:50px; WIDTH: 1400px; HEIGHT: 660px;">

<div style="WIDTH: 900px; HEIGHT: 100%;position:relative;float:left">


<div id="2" style=";BACKGROUND-COLOR :rgb(255, 191, 0); WIDTH: 300px; HEIGHT: 320px;position:relative;float:left">
</div>
<div id="1" style=";BACKGROUND-COLOR :rgb(255, 127, 0); WIDTH: 300px; HEIGHT: 320px;position:relative;float:left">
</div>
<div id="3" style=";BACKGROUND-COLOR :rgb(255, 63, 0); WIDTH: 300px; HEIGHT: 320px;position:relative;float:left">
</div>
<div id="5" style=";BACKGROUND-COLOR :rgb(0, 63, 255); WIDTH: 300px; HEIGHT: 320px;position:relative;float:left">
</div>
<div id="4" style=";BACKGROUND-COLOR :rgb(0, 127, 255); WIDTH: 300px; HEIGHT: 320px;position:relative;float:left">
</div>
<div id="6" style=";BACKGROUND-COLOR :rgb(0, 191, 255); WIDTH: 300px; HEIGHT: 320px;position:relative;float:left">
</div>

</div>

<div style="position:relative;float:left; padding:50PX;">
<form name="choix" style="COLOR :#FFF;font-family: papyrus ; font-size: 20PX;">
T (entre 0 et 360°) <input type="text" name="teinte" size="3"><BR><BR>Delta (entre 0 et 90°) <input type="text" name="delta" size="3"><BR><BR>
<input type="button" value="go" OnClick="go();">
</form>
</div>

</div>

</TD></TR></TABLE>
</BODY></HTML>

Configuration: Windows Vista Internet Explorer 8.0

Meilleures réponses pour « 1 programme pour bien choisir les couleurs » dans :
[Programmation] Critères de choix d'un langage/framework Voir[Note de sebsauvage: Cet article est loin d'être complet ! à compléter, détailler et raffiner] Voici quelques questions à vous poser pour bien choisir un langage, une plateforme de développement ou un framework pour un projet. Il est...
Garder une zone en couleur sur une photo noir et blanc VoirVous souhaitez avoir une photo en noir et blanc sauf une partie de la photo à conserver en couleur. Voici le principe de la manipulation : il faut isoler une partie de la photo (celle que l'on veut garder en couleur) en la sélectionnant. Ensuite...
[Programmation] Comment débuter, quel langage? VoirComment débuter, quel langage? Introduction Ceux que l'on peut utiliser Delphi/Pascal Java Python .Net Smalltalk Ceux que l'on peut utiliser à la rigueur C/C++ PHP Ada Lisp/Caml/... Ceux que l'on peut ne pas utiliser

1

jjsteing, le 12 jui 2009 à 19:41:52

2 ptites choses.... dans firefox il y a la console d erreur... tres utile pour voir ce qui va pas... et il faut pas que tu mette des ';' partout...

voici ton code modifier...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>

<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">

<TITLE>C O U L E U R S</TITLE>

<script language="javascript">

function go() {
var tei = document.choix.teinte.value ;
var angl = document.choix.delta.value ;

for (i=1 ; i<7 ; i++) {

var ident = document.getElementById(i) ;
switch (i)
{
case 1: { var te = tei; break }
case 2: { var te = tei + angl ;
if ( te > 360 ) {var te = tei + angl - 360 ;}; break }
case 3: { var te = tei - angl ;
if ( te < 0 ) {var te = tei - angl + 360 ; } break;}
case 4: { var te = tei + 180 ;
if ( te > 360 ) {var te = tei + 180 - 360 ; }break;}
case 5: { var te = tei + angl + 180 ;
if ( te > 360 ) {var te = tei + angl + 180 - 360 ; } break;}
case 6: { var te = tei - angl + 180 ;
if ( te > 360 ) {var te = tei - angl + 180 - 360 ; }break;}
}

var t = te * 255 / 60 ;

if (te < 60) {
var r = 255 ;
var v = t ;
var b = 0 ;
}

else if (te >= 60 && te < 120) {
var r = - t + 510 ;
var v = 255 ;
var b = 0 ;
}

else if (te >= 120 && te < 180) {
var r = 0 ;
var v = 255 ;
var b = t - 510 ;
}

else if (te >= 180 && te < 240) {
var r = 0 ;
var v = - t + 1020 ;
var b = 255 ;
}

else if (te >= 240 && te < 300) {
var r = t - 1020 ;
var v = 0 ;
var b = 255 ;
}

else if (te >= 300) {
var r = 255 ;
var v = 0 ;
var b = - t + 1530 ;
}

ident.style.backgroundColor = "rgb(" + r + "," + v + "," + b + ")" ; } ; }

</script>

</HEAD>
<BODY style="BACKGROUND-COLOR :#2E2E2E;text-align: left">
<TABLE style="WIDTH: 100%; HEIGHT: 100%" border=0 cellSpacing=0 cellPadding=0>
<TR>
<TD style="vertical-align: middle;">

<div style="padding-left:50px; WIDTH: 1400px; HEIGHT: 660px;">

<div style="WIDTH: 900px; HEIGHT: 100%;position:relative;float:left">


<div id="2" style=";BACKGROUND-COLOR :rgb(255, 191, 0); WIDTH: 300px; HEIGHT: 320px;position:relative;float:left">
</div>
<div id="1" style=";BACKGROUND-COLOR :rgb(255, 127, 0); WIDTH: 300px; HEIGHT: 320px;position:relative;float:left">
</div>
<div id="3" style=";BACKGROUND-COLOR :rgb(255, 63, 0); WIDTH: 300px; HEIGHT: 320px;position:relative;float:left">
</div>
<div id="5" style=";BACKGROUND-COLOR :rgb(0, 63, 255); WIDTH: 300px; HEIGHT: 320px;position:relative;float:left">
</div>
<div id="4" style=";BACKGROUND-COLOR :rgb(0, 127, 255); WIDTH: 300px; HEIGHT: 320px;position:relative;float:left">
</div>
<div id="6" style=";BACKGROUND-COLOR :rgb(0, 191, 255); WIDTH: 300px; HEIGHT: 320px;position:relative;float:left">
</div>

</div>

<div style="position:relative;float:left; padding:50PX;">
<form name="choix" style="COLOR :#FFF;font-family: papyrus ; font-size: 20PX;">
T (entre 0 et 360°) <input type="text" name="teinte" size="3"><BR><BR>Delta (entre 0 et 90°) <input type="text" name="delta" size="3"><BR><BR>
<input type="button" value="go" OnClick="go();">
</form>
</div>

</div>

</TD></TR></TABLE>

Répondre à jjsteing

2

TOTO ARC EN CIEL, le 12 jui 2009 à 20:20:55

Merci beaucoup !

Cette réponse débloque bien la situation, mais il reste à élucider autre problème : la page d'accueil affiche de base les couleurs correpondant aux valeurs pout T = 30° et D = 15° on ne retrouve pas les mêmes couleurs si on fait le test - je m'y relonge, en tout cas merci encore.

Répondre à TOTO ARC EN CIEL

3

jjsteing, le 12 jui 2009 à 20:33:13

Ptite chose encore.. au lieu d utiliser tes 50 else if... met que le if.. tout de facon il rentre pas dans les autres if ;)

Répondre à jjsteing

4

TOTO ARC EN CIEL, le 12 jui 2009 à 20:43:07

Voici ce qu'on obtient avec une meilleure écriture : (mais il reste 3 cases sur 6 qui ne fonctionnent pas)

<script language="javascript">

function go() {
var tei = document.choix.teinte.value ;
var angl = document.choix.delta.value ;

for (i=1 ; i<7 ; i++) {

var ident = document.getElementById(i) ;


switch (i) {
case 1: { var te = tei; break }
case 2: { var te = tei + angl ;
if ( te > 360 ) {var te = tei + angl - 360 ;} break;}
case 3: { var te = tei - angl ;
if ( te < 0 ) {var te = tei - angl + 360 ; } break;}
case 4: { var te = tei + 180 ;
if ( te > 360 ) {var te = tei + 180 - 360 ; } break;}
case 5: { var te = tei + angl + 180 ;
if ( te > 360 ) {var te = tei + angl + 180 - 360 ; } break;}
case 6: { var te = tei - angl + 180 ;
if ( te > 360 ) {var te = tei - angl + 180 - 360 ; } break;} }


var t = te * 255 / 60 ;

if (te < 60) {
var r = 255 ;
var v = t ;
var b = 0 ;
}

if ((te >= 60) && (te < 120)) {
var r = - t + 510 ;
var v = 255 ;
var b = 0 ;
}

if ((te >= 120) && (te < 180)) {
var r = 0 ;
var v = 255 ;
var b = t - 510 ;
}

if ((te >= 180) && (te < 240)) {
var r = 0 ;
var v = - t + 1020 ;
var b = 255 ;
}

if ((te >= 240) && (te < 300)) {
var r = t - 1020 ;
var v = 0 ;
var b = 255 ;
}

if (te >= 300) {
var r = 255 ;
var v = 0 ;
var b = - t + 1530 ;
}

ident.style.backgroundColor = "rgb(" + r + "," + v + "," + b + ")" } }

</script>

Répondre à TOTO ARC EN CIEL

5

jjsteing, le 12 jui 2009 à 20:51:14

J ais cette erreur, si ca peut te mettre sur la voie ;)

Warning: Expected an integer but found '42.5'. Error in parsing value for property 'background-color'.

Répondre à jjsteing

6

TOTO ARC EN CIEL, le 12 jui 2009 à 21:16:18

Ce n'est pas très glorieux, mais j'ai résolu ce dernier problème en multipliant par 1 mes variables (il semble que les additions sont considérées comme du concatener de texte)

merci et bonne soirée

Répondre à TOTO ARC EN CIEL

7

 jjsteing, le 12 jui 2009 à 21:20:57

Ok

met en resolu si tu pense que c bon :)

Répondre à jjsteing