[javascript] faire défiler des couleurs
sittingbull
Messages postés
14
Date d'inscription
Statut
Membre
Dernière intervention
-
sittingbull Messages postés 14 Date d'inscription Statut Membre Dernière intervention -
sittingbull Messages postés 14 Date d'inscription Statut Membre Dernière intervention -
Salut à tous !
J'ai trouvé un script pour mon site et quand je l'affiche dans le navigateur, j'ai une page blanche. Pourtant je ne constate pas d'erreur de syntaxe. Merci pour votre aide SB
<script>
couleurs = new Array();
couleurs[1] = "000000";
couleurs[2] = "111111";
couleurs[3] = "222222";
couleurs[4] = "333333";
couleurs[5] = "444444";
couleurs[6] = "555555";
couleurs[7] = "666666";
couleurs[8] = "777777";
couleurs[9] = "888888";
couleurs[10] = "999999";
couleurs[11] = "AAAAAA";
couleurs[12] = "BBBBBB";
couleurs[13] = "CCCCCC";
couleurs[14] = "DDDDDD";
couleurs[15] = "EEEEEE";
couleurs[16] = "FFFFFF";
compteur = 1;
function degrade() {
document.bgColor = couleurs[compteur++];
if (compteur < couleurs.length)
setTimeout('degrade()', 50);
}
<script/>
J'ai trouvé un script pour mon site et quand je l'affiche dans le navigateur, j'ai une page blanche. Pourtant je ne constate pas d'erreur de syntaxe. Merci pour votre aide SB
<script>
couleurs = new Array();
couleurs[1] = "000000";
couleurs[2] = "111111";
couleurs[3] = "222222";
couleurs[4] = "333333";
couleurs[5] = "444444";
couleurs[6] = "555555";
couleurs[7] = "666666";
couleurs[8] = "777777";
couleurs[9] = "888888";
couleurs[10] = "999999";
couleurs[11] = "AAAAAA";
couleurs[12] = "BBBBBB";
couleurs[13] = "CCCCCC";
couleurs[14] = "DDDDDD";
couleurs[15] = "EEEEEE";
couleurs[16] = "FFFFFF";
compteur = 1;
function degrade() {
document.bgColor = couleurs[compteur++];
if (compteur < couleurs.length)
setTimeout('degrade()', 50);
}
<script/>
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 LG
- Javascript arrondi ✓ - Forum Javascript
- Légende couleurs google maps - Accueil - Transports & Cartes
3 réponses
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>
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
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
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
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>
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.