[javascript] faire défiler des couleurs
Fermé
sittingbull
Messages postés
14
Date d'inscription
mardi 25 juillet 2006
Statut
Membre
Dernière intervention
2 octobre 2009
-
26 juil. 2006 à 17:01
sittingbull Messages postés 14 Date d'inscription mardi 25 juillet 2006 Statut Membre Dernière intervention 2 octobre 2009 - 28 juil. 2006 à 15:56
sittingbull Messages postés 14 Date d'inscription mardi 25 juillet 2006 Statut Membre Dernière intervention 2 octobre 2009 - 28 juil. 2006 à 15:56
A voir également:
- [javascript] faire défiler des couleurs
- Telecharger javascript - Télécharger - Langages
- La boite à couleurs - Télécharger - Divers Photo & Graphisme
- Remettre les couleurs d'origine android ✓ - Forum Windows 10
- Mon écran tv passe par toutes les couleurs - Forum Matériel & Système
- Je n'ai plus de couleur sur mon portable samsung Grand Ecran ✓ - Forum Samsung
3 réponses
kilian
Messages postés
8731
Date d'inscription
vendredi 19 septembre 2003
Statut
Modérateur
Dernière intervention
20 août 2016
1 527
27 juil. 2006 à 03:29
27 juil. 2006 à 03:29
Salut,
Tu as une page blanche car la fonction dégradé est définie mais pas appelée.
Donc à la fin du script il faut encore rajouter:
De même, la balise script à la fin est fermée du mauvais côté.
J'ai testé le dégradé et c'est pas mal mais ça manque de fluidité. Il passe par 16 couleurs.
Si ça te dit, je me suis inspiré de ce script pour en faire un autre configurable. Ca te permet d'avoir un dégradé (toujours noir et blanc) mais en passant par le nombre de couleur que tu veux (dans les puissances de 2) : 256, 128, 64, 32 etc...
Et là, la fluidité est au rendrez vous....
Tu as une page blanche car la fonction dégradé est définie mais pas appelée.
Donc à la fin du script il faut encore rajouter:
degrade()
De même, la balise script à la fin est fermée du mauvais côté.
J'ai testé le dégradé et c'est pas mal mais ça manque de fluidité. Il passe par 16 couleurs.
Si ça te dit, je me suis inspiré de ce script pour en faire un autre configurable. Ca te permet d'avoir un dégradé (toujours noir et blanc) mais en passant par le nombre de couleur que tu veux (dans les puissances de 2) : 256, 128, 64, 32 etc...
Et là, la fluidité est au rendrez vous....
<script language="javascript"> /*Configuration */ config=new Array(); /*Cette option change le nombre de couleurs qui seront traversées dans le dégradé. Le nombre de couleurs qui passeront dans le dégradé sera 255/config["intervalle_couleurs"]. Si tu mets 1, 255 couleurs passeront, si tu mets 2, 127 couleurs passeront etc.... Plus il y a de couleurs et plus ce sera fluide mais lent. Par défaut je mets 2: un bon compromis */ config["intervalle_couleurs"] = 2; /* Cette option règle l'intervalle de temps (em millisecondes) entre chaque changement de couleur de l'arrière plan. Par défaut: 10 */ config["intervalle_temps"] = 10; /* Début du script */ couleur=0; intervalle_couleurs=0; /* Configure l'intervalle de couleur. Si config["intervalle_couleurs"] est à 1, alors la couleur sera incrémentée de 0x010101 àchaque dégradé. Si config["intervalle_couleurs"] est à 2, alors la couleur sera incrémentée de 0x020202 à chaque dégradé. */ function configure() { intervalle_couleurs = config["intervalle_couleurs"] + (config["intervalle_couleurs"] << 8) + (config["intervalle_couleurs"] << 16); } /* document.bgColor doit prendre une valeur hexa sous forme de chaine de caractère avec 6 chiffres hexa. Si notre couleur comprend moins de 6 chiffres, on rajoute des zero devant */ function padding(nombre) { padded_str=""; nombre=nombre.toString(16); if(nombre.length < 6){ for (i=0;i< (6-nombre.length);i++) { padded_str+="0"; } padded_str+=nombre; } else{ padded_str=nombre; } return padded_str; } // Le dégradé function degrade() { document.bgColor=padding(couleur); if (couleur < 0xffffff){ setTimeout("degrade()",config["intervalle_temps"]); } // N'allons pas trop loin dans l'incrémentation if ( (couleur + intervalle_couleurs) >= 0xffffff){ couleur = 0xffffff; } else{ couleur+=intervalle_couleurs; } } configure(); degrade(); </script>
sittingbull
Messages postés
14
Date d'inscription
mardi 25 juillet 2006
Statut
Membre
Dernière intervention
2 octobre 2009
28 juil. 2006 à 13:29
28 juil. 2006 à 13:29
Ok merci Kilian pour tes explications bien détaillées. Je vais essayer de nouveau. L'essentiel, c'est de ne pas se décourager ! merci encore Sb
sittingbull
Messages postés
14
Date d'inscription
mardi 25 juillet 2006
Statut
Membre
Dernière intervention
2 octobre 2009
28 juil. 2006 à 15:56
28 juil. 2006 à 15:56
Ouf ! Enfin ça marche en effet avec time out dans le petit script mais c'est du noir et blanc. Je suppose qu'il faut changer les hexa pour avoir de la couleur. Maintenant je vais essayer de faire marcher ton script car effectivement, c'est pas très fluide. SittingBull
27 juil. 2006 à 10:42
Merci pour ta réponse si rapide. Je débute en JS et j'ai des difficultés pour comprendre pourquio ça ne marche pas. Je vais corriger mon erreur et voir si ça marche. SB
27 juil. 2006 à 12:55
Donc je préfère que vous me disiez si le script tout simple suivant est correct car même celui-ci , il ne marche pas sur mon ordi !
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>degrade</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script>
couleurs = new Array();
couleurs[1] = "003300";
couleurs[2] = "006600";
couleurs[3] = "009900";
couleurs[4] = "00CC00";
couleurs[5] = "00FF00";
couleurs[6] = "330000";
couleurs[7] = "333300";
couleurs[8] = "336600";
couleurs[9] = "339900";
couleurs[10] = "33CC00";
couleurs[11] = "33FF00";
couleurs[12] = "660000";
couleurs[13] = "663300";
couleurs[14] = "666600";
couleurs[15] = "669900";
couleurs[16] = "00FF00";
function degrade() {
for (compteur = 0; compteur < couleurs.length; compteur ++) {
document.bgColor = couleurs[compteur];
}
}
degrade();
</script>
</head>
<body>
</body>
</html>
Autres questions : a-t-on besoin d'être connecté pour que ça marche ? L'appel de fonction doit-il être obligatoirement dans body ?
Quand je mets l'appel de la fonction dans body, le navigateur m'affiche cette fonction.
Merci d'avance pour votre réponse SB
28 juil. 2006 à 01:03
Donc le dégradé se fait, mais tellement rapidement que c'est invisible à l'oeil nu.
De même vu que tu as mis l'appel de la fonction dans le head, je ne sais pas si c'est valable.
Autres questions : a-t-on besoin d'être connecté pour que ça marche ?
Si ta page est hebergée sur internet, oui, il faut bien la charger. Mais tu peux mettre ça dans une page html sur ton disque dur et l'ouvrir avec ton navigateur.
L'appel de fonction doit-il être obligatoirement dans body ?
Si tu executes ta fonction entre les balises head, à priori la fonction s'execute alors que le body n'existe pas encore, donc ça risque de poser des problèmes. A tester.
Quand je mets l'appel de la fonction dans body, le navigateur m'affiche cette fonction.
L'appel de la fonction c'est du javascript. Et le javascript doit toujours être compris entre les balises
<script language="javascript">
..............
</script>
28 juil. 2006 à 01:11
Concernant le script que je t'ai fait.
Je l'ai testé sous Internet Explorer 5 et Mozilla Firefox 1.5
Et je n'ai aucun soucis. Donc tu l'as peut être mal copié/collé, ou bien tu as rajouté des trucs sur la page qui provoquent une erreur.