Discussion :

[harkrisz]

Bonjour,
J'ai un menu avec plusieurs élements normal, et avec un seul élement avec des sous éléments.

Je voudrais bien que quand je clique par exemple sur "sousMenu1" et j'affiche la page sousMenu1.php mes sous éléments restent afficher, c'est-à-dire que mon sous menu ne se referme pas, seulement si je clique sur un normal élément de menu par exemple sur "Element1". Comment je pourrais faire? Merci!

Le code javascript:

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
$(document).ready( function () {
    $("#menu_left dt.sousMenu").hide();
    $("#menu_left dl.toggleSousMenu span").each( function () {
        var TexteSpan = $(this).text();
        $(this).replaceWith('<a href="" title="Afficher le sous-menu">' + TexteSpan + '<\/a>') ;
    } ) ;
    $("#menu_left dl.toggleSousMenu > a").click( function () {
        if ($(this).next("dt.sousMenu:visible").length != 0) {
            $(this).next("dt.sousMenu").slideUp("normal");
        }
        else {
            $("#menu_left dt.sousMenu").slideUp("normal");
            $(this).next("dt.sousMenu").slideDown("normal");
        }
        return false;
    });    
} ) ;

Mon menu:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
<dt>                                                     
    <dl><a href="elemen1.php">Element1</a></dl>
    <dl><a href="element2.php">Element2</a></dl>
        <dl class="toggleSousMenu"><span>Sous Menu</span>
	   <dt class="sousMenu">
		<dl class="active"><a href="sousMenu1.php" title="sousMenu1">sousMenu1</a></dl>
	           <dl><a href="sousMenu2.php" title="sousMenu2">sousMenu2</a></dl>
	            <dl><a href="sousMenu3.php" title="sousMenu3">sousMenu3</a></dl>
	   </dt>
	</dl>
	<dl><a href="element3.php">Element3</a></dl>
	<dl><a href="element4.php">Element4</a></dl>

[Lorenzo77]

salut,

il faut faire un test pour connaitre qu'elle est la page courante et ouvrir le menu correspondant

[harkrisz]

Je n'ai pas compris qu'est-ce que je devrais faire... Quel test? Est-ce que tu pourrais m'expliquer? Merci!

[Lorenzo77]

chaque élement A (<a href=...) du menu correspond a une page !

donc une condition sur le "window.location" et sur les "href" permet de trouver qu'elle est la page courante, aprés il te suffit d'ouvrir le menu sur l’élément correspondant

[harkrisz]

Merci, mais ça n'a rien changé malheureusement. La page est bien ouverte, mais le menu ne reste pas ouverte toujours pas... C'est le lien le site. Quand je clique sur recette et après tarte, recette se referme, mais je voudrais qu'il reste ouverte.... Et qu'il soit refermé quand je clique par exemple sur acceuil.

[Lorenzo77]

je vois pas le test sur le nom de la page
ton cas est simple, tu n'as que 3 pages qui ouvre le menu > tarte.php/creme.php/chocolat.php
test si la page courante (affiché dans le navigateur) est une des 3 et si c'est oui, alors ouvre ton menu

[harkrisz]

J'ai modifié le code, mais ça ne fonctionne pas, comme je suis débutant j'arrive pas trouver comment faire... Merci pour votre aide!

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
$(document).ready( function () {
    $("#menu_left dt.sousMenu").hide();
    $("#menu_left dl.toggleSousMenu span").each( function () {
        var TexteSpan = $(this).text();
        $(this).replaceWith('<a href="" title="Afficher le sous-menu">' + TexteSpan + '<\/a>') ;
    } ) ;
    $("#menu_left dl.toggleSousMenu > a").click( function () {
        if ($(this).next("dt.sousMenu:visible").length != 0) {
            $(this).next("dt.sousMenu").slideUp("normal");
 
        }
 
 
        else {
			$(this).next("dt.sousMenu").slideDown("normal");
		if(window.location.href='http://localhost/site2/tarte.php' == true){
			 $("#menu_left dt.sousMenu").show();
		}
		if(window.location.href='http://localhost/site2/chocolat.php' == true){
			 $("#menu_left dt.sousMenu").show();
		}
		if(window.location.href='http://localhost/site2/creme.php' == true){
			 $("#menu_left dt.sousMenu").show();
		}
 
 
        }
        return false;
    });    
} ) ;

[Lorenzo77]

biggre
tu as ajouté le code dans l'evenement "click"

le code doit être exécuté a chaque chargement de page, il doit être hors du "click" mais dans le "ready", exemple :

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
$(document).ready(function() {
	$("#menu_left dt.sousMenu").hide();
	$("#menu_left dl.toggleSousMenu span").each(function() {
		var TexteSpan = $(this).text();
		$(this).replaceWith('<a href="" title="Afficher le sous-menu">' + TexteSpan + '<\/a>');
	});
	$("#menu_left dl.toggleSousMenu > a").click(function() {
		if ($(this).next("dt.sousMenu:visible").length != 0) {
			$(this).next("dt.sousMenu").slideUp("normal");
		}
		return false;
	});
	$(this).next("dt.sousMenu").slideDown("normal");
	if (window.location.href = 'http://localhost/site2/tarte.php' == true) {
		$("#menu_left dt.sousMenu").show();
	}
	if (window.location.href = 'http://localhost/site2/chocolat.php' == true) {
		$("#menu_left dt.sousMenu").show();
	}
	if (window.location.href = 'http://localhost/site2/creme.php' == true) {
		$("#menu_left dt.sousMenu").show();
	}
});

plutot que tester l'url en entier, tu pourrais faire ceci (ca sera moins chiant a chaque changement de serveur !) :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

if( window.location.href.indexOf('tarte.php') !== - 1 ){ // code a exxecuter

je ne pense pas que l'utilisation des TAGs DT/ DL dans un menu soit une bonne chose, tu aurais pu te contenter de UL / Li .

[harkrisz]

Merci, j'ai essayé ton exemple, et c'est bon, merci!

Sauf que je crois que n'ai pas bien récuperer la page courrant, parce que quand je clique sur recette, il n'affiche pas le menu. En fait recette c'est un span... Comment je pourrais faire? Quand je tape dierctement par exemple tarte.php. La page s'affiche bien, et le menu reste ouvert tant que je suis dans le sous-menu.

[Lorenzo77]

faut mettre a jour ton site http://recettesgourmands.free.fr/ comme ca je peux facilement voir ce qui merdouille

[harkrisz]

C'est fait.

C'est bon, j'ai trouvé moi-même! J'ai ajouté

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$(this).next("dt.sousMenu").slideDown("normal");

avant le return false. Merci beaucoup pour ton aide!!