IdentifiantMot de passe
Loading...
Mot de passe oubli� ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les r�ponses en temps r�el, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Modifier dynamiquement la couleur de fond


Sujet :

JavaScript

Vue hybride

Message pr�c�dent Message pr�c�dent   Message suivant Message suivant
  1. #1
    Membre confirm�
    Profil pro
    Inscrit en
    Janvier 2006
    Messages
    91
    D�tails du profil
    Informations personnelles :
    �ge : 39
    Localisation : France

    Informations forums :
    Inscription : Janvier 2006
    Messages : 91
    Par d�faut Modifier dynamiquement la couleur de fond
    Bonjour,

    pour mon site, j'aimerais pouvoir proposer aux visiteurs de personnaliser la couleur de fond selon leur pr�f�rence � l'aide d'un petit formulaire :
    Code : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    <form>
    	<select onChange="javascript:chgColor(this)">
    		<option value="0">noir</option>
    		<option value="1">gris</option>
    		<option value="2" selected="true">beige</option>
    		<option value="3">brun</option>
    		<option value="4">ocre</option>
    	</select>
    </form>
    J'utilise donc Javascript pour acc�der � la propri�t� bgColor de la balise body :
    Code : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
     
    <script type="text/javascript">
    	function chgColor(selection){
    		var color = selection.options[selection.selectedIndex].value;
     
    		switch(name){
    			case 0: document.body.bgColor = "black"; break;
    			case 1: document.body.bgColor = "gray"; break;
    			case 2: document.body.bgColor = "#BA7741"; break;
    			case 3: document.body.bgColor = "#660000"; break;
    			case 4: document.body.bgColor = "#FFFF66"; break;
    			default: document.body.bgColor = "#BA7741"; break;
    		}
    	}
    </script>
    Le hic, c'est que rien ne se passe quand je choisis une autre couleur via le formulaire, pas d'erreurs javascript (en tout cas Firebug ne gueule pas ) mais pas de changement de couleur non plus.

    Ma fonction javascript est-elle correcte ?

    Merci d'avance pour votre aide

  2. #2
    R�dacteur/Mod�rateur

    Avatar de SpaceFrog
    Homme Profil pro
    D�veloppeur Web Php Mysql Html Javascript CSS Apache - Int�grateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activit� : D�veloppeur Web Php Mysql Html Javascript CSS Apache - Int�grateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par d�faut
    un switch sur name ...

    pourquoi pas... mais c'est quoi name ?
    Ma page Developpez - Mon Blog Developpez
    Pr�sident du CCMPTP (Comit� Contre le Mot "Probl�me" dans les Titres de Posts)
    Deux r�gles du succ�s: 1) Ne communiquez jamais � quelqu'un tout votre savoir...
    Votre post est r�solu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de D�veloppez !

  3. #3
    Membre confirm�
    Profil pro
    Inscrit en
    Janvier 2006
    Messages
    91
    D�tails du profil
    Informations personnelles :
    �ge : 39
    Localisation : France

    Informations forums :
    Inscription : Janvier 2006
    Messages : 91
    Par d�faut
    Effectivement !! J'ai honte

    Ce n'est pas "name" qu'il fallait lire mais "color", voil� le code corrig� :
    Code : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
     
    <script type="text/javascript">
    	function chgColor(selection){
    		var color = selection.options[selection.selectedIndex].value;
     
    		switch(color){
    			case 0: document.body.bgColor = "black"; break;
    			case 1: document.body.bgColor = "gray"; break;
    			case 2: document.body.bgColor = "#BA7741"; break;
    			case 3: document.body.bgColor = "#660000"; break;
    			case 4: document.body.bgColor = "#FFFF66"; break;
    			default: document.body.bgColor = "#BA7741"; break;
    		}
    	}
    </script>
    Grosse bourde corrig�e, merci SpaceFrog. Mais �a ne marche malheureusement pas plus

  4. #4
    Membre averti
    Profil pro
    Inscrit en
    Mai 2008
    Messages
    22
    D�tails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2008
    Messages : 22
    Par d�faut
    Est ce que tu recoit la variable? Met un alert("ma var"+color); dans ton code pour v�rifier.

  5. #5
    R�dacteur/Mod�rateur

    Avatar de SpaceFrog
    Homme Profil pro
    D�veloppeur Web Php Mysql Html Javascript CSS Apache - Int�grateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activit� : D�veloppeur Web Php Mysql Html Javascript CSS Apache - Int�grateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par d�faut
    le select est un peu particulier, il faut passer this.value ...
    Code : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
     
     
    <form>
    	<select onChange="chgColor(this.value)">
    		<option value="0">noir</option>
    		<option value="1">gris</option>
    		<option value="2" selected="true">beige</option>
    		<option value="3">brun</option>
    		<option value="4">ocre</option>
    	</select>
    </form>

    et du coup, sans oublier que les values sont des strings ..

    Code : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    <script type="text/javascript">
    	function chgColor(selection){
     
    		switch(selection){
    			case ("0"): document.body.bgColor = "black"; break;
    			case ("1"): document.body.bgColor = "gray"; break;
    			case ("2"): document.body.bgColor = "#BA7741"; break;
    			case ("3"): document.body.bgColor = "#660000"; break;
    			case ("4"): document.body.bgColor = "#FFFF66"; break;
    			default: document.body.bgColor = "#BA7741"; break;
    		}
    	}
    </script>
    Ma page Developpez - Mon Blog Developpez
    Pr�sident du CCMPTP (Comit� Contre le Mot "Probl�me" dans les Titres de Posts)
    Deux r�gles du succ�s: 1) Ne communiquez jamais � quelqu'un tout votre savoir...
    Votre post est r�solu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de D�veloppez !

  6. #6
    Expert confirm�
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 660
    D�tails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 660
    Par d�faut
    Code : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
     
    document.body.bgColor =  "#BA7741";


    Utilise cette syntaxe :
    Code : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
     
    document.body.style.backgroundColor = "#BA7741";

Discussions similaires

  1. Modifier dynamiquement la couleur d'une cellule
    Par Kraian dans le forum Powerbuilder
    R�ponses: 1
    Dernier message: 14/03/2014, 19h57
  2. Modifier couleur de fond d'une cellule d'un tableau dynamiquement.
    Par fred61 dans le forum G�n�ral JavaScript
    R�ponses: 8
    Dernier message: 27/03/2009, 02h19
  3. R�ponses: 1
    Dernier message: 19/11/2007, 12h00
  4. [JTable] Modifier la couleur de fond d'une ligne
    Par joes_bushi dans le forum Composants
    R�ponses: 2
    Dernier message: 20/09/2005, 12h13
  5. Modifier la couleur de fond d'un popupmenu
    Par lil_jam63 dans le forum Composants VCL
    R�ponses: 6
    Dernier message: 05/08/2004, 20h23

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo