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 :

Changer le couleur de fond


Sujet :

JavaScript

  1. #1
    Membre régulier
    Homme Profil pro
    Inscrit en
    Janvier 2008
    Messages
    306
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 40
    Localisation : France

    Informations forums :
    Inscription : Janvier 2008
    Messages : 306
    Points : 106
    Points
    106
    Par défaut Changer le couleur de fond
    Bonjour,

    Le code ci-dessous est censé changer la couleur de fond de l'élement <div></div> selon la selection de l'internaute...
    Si quelqu'un peut me dépanner... Merci

    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
    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
    <style type="text/css">
    div.moteur
    	{
    	height : 150px;
    	width : 240px; 
    	border : solid 1px black;
    	background-color : #FFFF00;
    	padding-left : 5px;
    	padding-right : 5px;
    	padding-top : 5px;
    	padding-bottom : 5px;
    	}
    </style>
    <script type="text/javascript">
    function changement()
    	{
    var mon_element = document.getElementById("moteur");
     
    	var fond = document.selection_couleur.couleur.value;
    	mon_element.style.backgroundColor = "fond";
    	}
    </script>
     
    </head>
    <body>
     
     
    <div class="moteur" id="moteur">
    <form>
    <table>
     
    </table>
    </form>
    </div>
     
    <div>
    Couleur de fond : 
     
    <form>
    <select name="couleur" onChange="changement();">
    	<option value="red">Rouge</option>
    	<option value="blue" selected="selected">Bleu</option>
    	<option value="pink">Violet</option>
    </select>
    </form>

  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 640
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    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 640
    Points : 66 663
    Points
    66 663
    Billets dans le blog
    1
    Par défaut
    c'est quoi fond ???

  3. #3
    Membre expérimenté
    Avatar de jbrasselet
    Homme Profil pro
    Chef de projet NTIC
    Inscrit en
    Mars 2006
    Messages
    1 022
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : Chef de projet NTIC
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mars 2006
    Messages : 1 022
    Points : 1 413
    Points
    1 413
    Par défaut
    déjà ta variable fond n'est pas correctement affectée

    c'est quoi selection_couleur?

    ensuite une fois que ta variable fond existera il faudra que tu affectes le background avec fond et pas "fond"

  4. #4
    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 640
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    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 640
    Points : 66 663
    Points
    66 663
    Billets dans le blog
    1
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    var fond = document.forms[0].elements['couleur'].value;
    	mon_element.style.backgroundColor = fond;

  5. #5
    Membre régulier
    Homme Profil pro
    Inscrit en
    Janvier 2008
    Messages
    306
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 40
    Localisation : France

    Informations forums :
    Inscription : Janvier 2008
    Messages : 306
    Points : 106
    Points
    106
    Par défaut
    Citation Envoyé par jbrasselet Voir le message
    c'est quoi selection_couleur?
    Avant de poster j'avais nommé ce formulaire "couleur_fond" <form name="couleur_fond"> (que j'ai ensuite effacé) au lieu de forms[1] voila pourquoi cette propriété est présente.


    Merci pour la réponse ! Finalement, quand je regarde même si ca ne fonctionnait pas le code que j'ai écrit n'était pas si faux que ca...

    Merci encore

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Réponses: 4
    Dernier message: 26/07/2005, 10h45
  2. Réponses: 10
    Dernier message: 04/04/2005, 21h52
  3. Changer la couleur de fond d'un champ "text"
    Par nic211 dans le forum Général JavaScript
    Réponses: 8
    Dernier message: 15/02/2005, 13h50
  4. [POO] Changer la couleur de fond d'un tableau
    Par Netoman dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 31/12/2004, 20h12
  5. Changer la couleur de fond de l'écran
    Par tnk dans le forum x86 16-bits
    Réponses: 5
    Dernier message: 19/01/2003, 01h37

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