11540 sujets

JavaScript, DOM et API Web HTML5

Bonjour, je c'est que la question a été traité un certain nombre de fois, ayant moi meme essayer tout les solutions avant de me decider a posté

J'ai, pour un site, créer un menu vertical (http://css.alsacreations.com/Construction-de-menus-en-CSS/Un-menu-deroulant-en-CSS-et-XHTML-vertical-et-horizontal) et "j'ai" modifié quelque peut le javascript afin que le sous menu s'enroule lors du clique sur une catégorie!

Je souhaiterai maintenant pour, lors d'un clique sur un sous menu, conserver ce meme sous-menu déroulé

Ma situation est quelque peut particuliere car mon menu ne se trouve pas sur la page elle même, mais est appellé grace a un include dans index.php

Voici la partie javascript de menu.php :
<script type="text/javascript">
window.onload=hide;
function hide() {
	for (var i = 1; i<=10; i++) {
			if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
		}
}

function montre(id) {
	var d = document.getElementById(id);
	if (d.style.display=='none') {
		
		for (var i = 1; i<=10; i++) {
			if ((document.getElementById('smenu'+i)) && ('smenu'+i != id)) {document.getElementById('smenu'+i).style.display='none';}
		}
		d.style.display='block';
	}
	else {
		d.style.display='none';
	}
}

</script>


et voici la partie html du menu
<dl id="menu">
	<h3> Navigation </h3>
	
	<dt onclick="javascript:montre('smenu1');"><a href="#">Gestion des emprunts</a></dt>
		<dd id="smenu1">
				<ul>
					<li><a href="page1.php">Enregistrer un emprunt</a></li>
					<li><a href="page2.php">Enregistrer un retour</a></li>
					<li><a href="#">Lister les retards</a></li>
				</ul>
			</dd>	

	
	<dt onclick="javascript:montre('smenu2');"><a href="#">Gestion des documents</a></dt>
		<dd id="smenu2">

				<ul>
					<li><a href="#">Ajouter un documents</a></li>
					<li><a href="#">Modifier un documents</a></li>
					<li><a href="#">Supprimer un documents</a></li>
				</ul>
			</dd>	
</dl>


page1.php, page2.php ainsi que index.php ont menu.php en include

Ma question est de savoir s'il est possible de garder le menu ouvert lors d'un changement de page?

Merci d'avance pour votre aide...
bonjour,
tu ne pourras pas car tu recharge ta page à chaque appel.
Je ne croit pas non plus que cela soit faisable en utilisant la technologie Ajax.
Ce n'est pas un probléme ni ajax, ni javascript, c'est tout simplement que quand tu charges ta nouvelle page celle si se charge avec le menu ouvert... (display:block).

Tu peux resoudre ça en php, ta page envoi a ton menu une variable qui correspond a celui qui doit être ouvert.

Par exemple si ta page correspond a menu2 tu envois 2, ensuite tu créer un classe "smenu<?php echo $num_page?>" avec dans tes css :
.smenu1, .smenu2, .smenu3, .smenu4{display:block}
.smenu{display:none}

Ainsi celon la variable envoyé il ouvrira le sous menu correspondant à la page en cours

C'est un exemple de comment faire, c'est un peu du bricolage, il faudrait mieux utiliser les id de ton menu au lieu de rajouter des class a chaque item. C'est plus pour te donner une idée de comment proceder plutôt qu'une solution toute faite.
Modifié par matmat (10 Mar 2007 - 18:53)
Bonjour, j'utilise le même script que hikest mais je n'arrive pas à faire en sorte que le sous-menu reste ouvert lors de la navigation...

je vous explique...j'ai ma page qui charge un header

include("include/header.php")


Dans ce header je charge mon menu et mon code javascript

<script language=javascript src="./include/menu/onload.js"></script>


include_once("menu/menu.php"); 


voici mon code onload.js

function encours(menu)
{
	montre('smenu'+menu);
}
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=12; i++) {
		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
	}
if (d) {d.style.display='block';}
}


et voilà comment se présente mon menu.php

<dl id="menu">

		<dt onClick="javascript:montre('smenu1');">Client</dt>
		<dd id="smenu1">
				<ul>
					<li><a href="cli_dem.php">Demande devis</a></li>
					<li><a href="cli_list.php">Listing</a></li>
					<li><a href="cli_up.php">Upload devis</a></li>
					<li><a href="cli_valDem.php">Val. demande</a></li>
					<li><a href="cli_rech.php">Recherche</a></li>
				</ul>
  </dd>	


Voilà, ma question est, comment faire pour forcer l'ouverture du sous-menu pour chaque page uploadées sans passer par l'option css?
(j'ai essayé en chargeant la fonction onload directement dans ma page principale et en faisant un "onload=javascript:montre('smenu1');" dans le body mais sans succes) Smiley decu

Quelqu'un aurait-il la solution? Merci d'avance Smiley smile