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

Mise en page CSS Discussion :

[CSS-Javascript] Menu déroulant


Sujet :

CSS

  1. #1
    Futur Membre du Club
    Profil pro
    Inscrit en
    Décembre 2002
    Messages
    7
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2002
    Messages : 7
    Points : 6
    Points
    6
    Par défaut [CSS-Javascript] Menu déroulant
    Voila j'ai fait un menu deroulant a l'aide de css et javascript, quand je clique sur un lien du menu la page cible est incluse dans ma page principal avec un include en php !

    mon probleme est que quand je clic sur un lien du sous menu ca recharge ma page et le menu ce referme.
    J'aimerai savoir si il y a un moyen pour que quand je clique sur un lien mon sous menu reste ouvert !

    Mon code javascript :
    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    window.onload=montre;
     
    /* FONCTION POUR LE MENU */  
    function montre(id) {
     
    	var d = document.getElementById(id);
    		for (var i = 1; i<=10; i++) {
    			if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
    		}
     
    	if (d) {d.style.display='block';}
    }
    /***********************************/

    Extrait du code pour le menu :
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    <div id="gauche">
    			 	<br/>
    				<p>Menu</p>
    				<dl>
    				<dt id="td1" class="" onclick="javascript:montre('smenu1');"><a href="#" onMouseOver="afficheDescURL(' Présentation de la gamme de produit Alcatel© ')" onMouseOut="afficheDescURL('')">Télécoms</a></dt>
    					<dd id="smenu1">
    						<ul>
    							<li><a href="index.php?page=omni1.php">Système téléphonique</a></li>
    							<li><a href="index.php?page=postes1.php">Postes numériques</a></li>
    							<li><a href="index.php?page=postes2.php">Postes analogiques</a></li>
    						</ul>
    					</dd>

    Pour le momment si je click sue "Télécoms" ca ouvre le sous menu 'smenu1' et si je click sur "Système téléphonique" ca inclus la page "omni1.php" mais ca referme mon sous menu !

    comment faire pour que le sous menu reste ouvert ?

    J'espère que je me suis fait comprendre !

    Merci de votre aide

  2. #2
    Futur Membre du Club
    Inscrit en
    Février 2004
    Messages
    6
    Détails du profil
    Informations forums :
    Inscription : Février 2004
    Messages : 6
    Points : 7
    Points
    7
    Par défaut
    Tu peux ajouter dans le code php de ton index.php
    Code php : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    if($page=='omnil.php' || $page=='poste1.php' || $page=='poste2.php)
      $id_rubrique='smenu1';
    // ... autres tests pour tes autres rubriques
    et toujours dans ton index.php mais dans le code Html
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <body onLoad="javascript:montre('<? echo $id_rubrique; ?>')">

    Normalement ça devrait faire ce que tu veux mais je n'ai pas testé

  3. #3
    Rédacteur/Modérateur
    Avatar de troumad
    Homme Profil pro
    Enseignant
    Inscrit en
    Novembre 2003
    Messages
    5 597
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 56
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Enseignant
    Secteur : Enseignement

    Informations forums :
    Inscription : Novembre 2003
    Messages : 5 597
    Points : 7 832
    Points
    7 832
    Par défaut
    As-tu un exemple à monter ?

    Moi, je te propose : http://troumad.free.fr/internet/xcours.html#mini_html (entièrement javascript) avec les liens du menu "Cette page"

    Je te popose la page http://troumad.free.fr/bible/Jean4a.php
    Regarde les entrée avec les deux entrées de Rligion->Evangile de Jean 4 (php + javascript).

    Je pense que ça fait ce que tu souhaites (au moins sous mozila). Le tout étant de ne pas recharger la page.
    Modérateur Mageia/Mandriva Linux
    Amicalement VOOotre
    Troumad Alias Bernard SIAUD à découvrir sur http://troumad.org
    Mes tutoriels : xrandr, algorigramme et C, xml et gtk...

  4. #4
    Futur Membre du Club
    Profil pro
    Inscrit en
    Décembre 2002
    Messages
    7
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2002
    Messages : 7
    Points : 6
    Points
    6
    Par défaut
    Citation Envoyé par fx_251
    Tu peux ajouter dans le code php de ton index.php
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    if($page=='omnil.php' || $page=='poste1.php' || $page=='poste2.php)
      $id_rubrique='smenu1';
    // ... autres tests pour tes autres rubriques
    et toujours dans ton index.php mais dans le code Html
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <body onLoad="javascript:montre('<? echo $id_rubrique; ?>')">
    Normalement ça devrait faire ce que tu veux mais je n'ai pas testé
    Ca ne pouvait pas marcher tel (car il recharge la page et donc perd la valeur de la variable) quel mais en passant $id_rubrique en parametre de mes liens j'ai réussi a faire ce que je voulais !

    Merci de ton aide qui m'a éclairer !

  5. #5
    Futur Membre du Club
    Inscrit en
    Février 2004
    Messages
    6
    Détails du profil
    Informations forums :
    Inscription : Février 2004
    Messages : 6
    Points : 7
    Points
    7
    Par défaut
    Ah oui effectivement C'etait meme plus simple que ce que je pensais

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

Discussions similaires

  1. Réponses: 10
    Dernier message: 19/05/2008, 14h46
  2. (D)HTML / CSS / Javascript : Menu idéal
    Par hpfx dans le forum Balisage (X)HTML et validation W3C
    Réponses: 4
    Dernier message: 30/08/2007, 14h25
  3. menu CSS + javascript
    Par taffMan dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 27/01/2007, 00h34
  4. Menu css/javascript
    Par vincedjs dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 22/02/2006, 11h37

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