1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
| <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> change couleurs </TITLE>
<script language="javascript" type="text/javascript">
<!--
// définition des couleurs
var coul = {"w":"FFFFFF", "c":"00FFFF", "v":"00FF00", "j":"FFFF00", "r":"FF0000", "m":"FF00FF", "b":"0000ff", "n":"000000"};
// ordre d'enchainement des couleurs
var ordr = "wcvjrmbwvrbcjmwjbvmcrwrcmvbjwmjcbrvwbmrjvcn";
var i = 0;
// variable temporaire pour le Rouge, le Vert et le Bleu
var Rtem = 0;
var Vtem = 0;
var Btem = 0;
// variable coefficient pour le Rouge, le Vert et le Bleu
var Rcof = 0;
var Vcof = 0;
var Bcof = 0;
var a = 0;
// initialisation du départ comme étant la couleur précédente
var prec = ordr.charAt(a);
// attribution des valeurs précédentes pour le Rouge, le Vert et le Bleu
var Rpre = parseInt(coul[prec].substr(0,2) , 16);
var Vpre = parseInt(coul[prec].substr(2,2) , 16);
var Bpre = parseInt(coul[prec].substr(4,2) , 16);
a++;
if(a > ordr.length) {a=0;}
// initialisation du départ comme étant la couleur actuelle
var actu = ordr.charAt(a);
// attribution des valeurs actuelles pour le Rouge, le Vert et le Bleu
var Ract = parseInt(coul[actu].substr(0,2) , 16);
var Vact = parseInt(coul[actu].substr(2,2) , 16);
var Bact = parseInt(coul[actu].substr(4,2) , 16);
// coefficient positif de vitesse pour le changement des couleurs
var cofp = 3; // 3 ou 5 ou 15 ou 17 ou 51 ou 85
// coefficient négatif de vitesse pour le changement des couleurs
var cofn = - cofp;
//boucle pour passer de 00 à FF
var bouc = 255 / cofp;
function change_coul()
{ // pour le Rouge
if(Ract == Rpre) {Rcof = 0 ;} // si la couleur précédente est la même, pas de changement
else if(Ract > Rpre) {Rcof = cofp ;} // si la couleur précédent est plus petite, coefficient positif
else {Rcof = cofn ;} // si la couleur précédent est plus grande, coefficient négatif
// pour le Vert
if(Vact == Vpre) {Vcof = 0 ;}
else if(Vact > Vpre) {Vcof = cofp ;}
else {Vcof = cofn ;}
// pour le Bleu
if(Bact == Bpre) {Bcof = 0 ;}
else if(Bact > Bpre) {Bcof = cofp ;}
else {Bcof = cofn ;}
// on incrémente chaque couleur en fonction de son coefficient
Rtem = Rpre + i * Rcof;
Vtem = Vpre + i * Vcof ;
Btem = Bpre + i * Bcof ;
// affichage de la couleur
myco = "#" + ValToHex(Rtem) + ValToHex(Vtem) + ValToHex(Btem);
document.getElementById("titre").style.backgroundColor = myco;
// tant que l'on a pas fini de changer de couleur
if(i < bouc) { i++ ;}
// une fois la boucle finie, définition de la prochaine couleur à afficher
else
{ a++;
if(a >= ordr.length) {a = 0;}
i = 0;
Rpre = Ract;
Vpre = Vact;
Bpre = Bact;
prec = actu;
actu = ordr.charAt(a);
Ract = parseInt(coul[actu].substr(0,2) , 16);
Vact = parseInt(coul[actu].substr(2,2) , 16);
Bact = parseInt(coul[actu].substr(4,2) , 16);
}
}
function ValToHex(nomb)
{ var hexa = nomb.toString(16);
return hexa.length == 1 ? "0" + hexa : hexa;
}
function interval_coul(terv)
{ terv = setInterval("change_coul()",500); // rafraichissement de l'affichage toute les 500 millisecondes
}
//-->
</script>
</HEAD>
<body bgcolor="#000000" onload="interval_coul()" onUnload="window.clearInterval(terv)" >
<br>
<h1 align="center" id="titre"><br> <br> <br> <br> <br> <br> <br><br></h1>
</BODY>
</HTML> |
Comment optimiser ce code tout simple ?
Répondre avec citation
Envoyé par SylvainPV
J'avais d'ailleurs complètement zappé ce principe de changement de vitesse avec coep, là où un previousSpeedCoef aurait été plus parlant. Pour changer la vitesse de transition, tu peux modifier à la volée en JS la propriété CSS transition-duration.
Partager