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 :

Modification de styles css


Sujet :

JavaScript

  1. #1
    Membre éclairé
    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
    Par défaut Modification de styles css
    Bonjour !

    J'ai un petit souci dans un de mes scripts JavaScript; je n'arrive pas à faire afficher la partie adéquate lorsque je selectionne l'un ou l'autre bouton radio de mon formulaire :

    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
    <style type="text/css">
    		#demander_cours
    		{
    		display : none;
    		}
    		#proposer_cours
    		{
    		display : none;
    		}
    		</style>
     
    		<script type="text/javascript">
    		function demander()
    		{
    		var demander_cours = document.getElementById("demander_cours");
    		demander_cours.style.display = "visible";
    		}
     
    		function proposer()
    		{
    		var proposer_cours = document.getElementById("proposer_cours");
    		proposer_cours.style.display = "visible";
    		}
    		</script>
     
     
    		Vous souhaitez :
     
    		<form>
    		<input type="radio" name="fo" value="" onclick="demander()"/>Demander des cours
    		<input type="radio" name="fo" value="" onclick="proposer()"/>Proposer des cours
    		</form>
     
    		<div id="demander_cours">
    		OOOOO
    		</div>
     
    		<!-- SECOND CADRE DEMANDER COURS -->
     
    		<div id="proposer_cours">
    		HHGHHHHH
    		</div>
    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 658
    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 658
    Billets dans le blog
    1
    Par défaut
    c'est une nouvelle propriété de display ?

    visible c'est pour visibility ...

    display tu peux avoir:
    none, block, inline, inherit, list-item,table, table-row, table-cell, table-column ...
    pour les plus connus plus quelques autres...
    mais pas de visible
    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
    Rédacteur/Modérateur
    Avatar de andry.aime
    Homme Profil pro
    Inscrit en
    Septembre 2007
    Messages
    8 391
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Ile Maurice

    Informations forums :
    Inscription : Septembre 2007
    Messages : 8 391
    Par défaut
    Mettre les scripts dans le head
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    function demander()
    		{
    document.getElementById("demander_cours").style.display = "block";
    		}
     
    		function proposer()
    		{
    document.getElementById("proposer_cours").style.display = "block";
    		}

  4. #4
    Membre expérimenté Avatar de k1rby
    Profil pro
    Développeur Web
    Inscrit en
    Novembre 2008
    Messages
    181
    Détails du profil
    Informations personnelles :
    Localisation : France, Haute Garonne (Midi Pyrénées)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Novembre 2008
    Messages : 181
    Par défaut
    Code XHTML : 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
     
    <p>Vous souhaitez :</p>
     
    <form>
    	<input id="fo1" type="radio" name="fo" value="" onclick="demander()" /><label for="fo1">Demander des cours</label>
    	<input id="fo2" type="radio" name="fo" value="" onclick="proposer()" /><label for="fo2">Proposer des cours</label>
    </form>
     
    <div id="demander_cours">
    	OOOOO
    </div>
     
    <!-- SECOND CADRE DEMANDER COURS -->
    <div id="proposer_cours">
    	HHGHHHHH
    </div>
    Code JavaScript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
     
    function demander(){
    	document.getElementById("demander_cours").style.display='block';
    	document.getElementById("proposer_cours").style.display='none';
    }
     
    function proposer(){
    	document.getElementById("proposer_cours").style.display='block';
    	document.getElementById("demander_cours").style.display='none';
    }
    Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
     
    #demander_cours{
    	display : none;
    }
    #proposer_cours{
    	display : none;
    }

  5. #5
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2008
    Messages
    23 647
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 54
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Juin 2008
    Messages : 23 647
    Billets dans le blog
    20
    Par défaut
    Citation Envoyé par andry.aime Voir le message
    Mettre les scripts dans le head
    Oui ! Mais surtout les styles...
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  6. #6
    Membre éclairé
    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
    Par défaut
    Citation Envoyé par SpaceFrog Voir le message
    c'est une nouvelle propriété de display ?
    heu ben non je crois pas que ca soit nouveau.

    Citation Envoyé par andry.aime Voir le message
    Mettre les scripts dans le head
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    function demander()
    		{
    document.getElementById("demander_cours").style.display = "block";
    		}
     
    		function proposer()
    		{
    document.getElementById("proposer_cours").style.display = "block";
    		}
    Ok pr le head, ici c'était pour une question de place que j'ai fait ça.
    Alors si j'ai bien compris :
    visibility = hidden ou visible.
    display : none ou block.

    Dans tous les cas je sais qu'il vaut mieux utiliser display que visibility.
    Merci en tout cas

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

Discussions similaires

  1. Modification du style css en localhost
    Par houssine91 dans le forum Dreamweaver
    Réponses: 3
    Dernier message: 30/07/2013, 13h14
  2. [DOM] Modification d'un style CSS (Déclaration attendue, mais ..)
    Par d-Rek dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 02/10/2007, 16h48
  3. Obtenir le style CSS d'un objet
    Par Sub0 dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 13/08/2005, 15h46
  4. Conflit dans les styles CSS
    Par Nerva dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 14/03/2005, 22h56
  5. Comment appliquer un style CSS ?
    Par adameteve dans le forum Mise en page CSS
    Réponses: 8
    Dernier message: 10/03/2005, 21h52

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