Bonjour le forum,

J'ai trouvé une fonction javascript sur internet (merci g1script ) qui gère un menu de navigation vertical en dépliant les liens des pages d'un sous-menu si on clique sur le nom de celui-ci.

Elle fonctionne très bien mais j'aimerais qu'à l'ouverture d'une page de mon site internet, elle ouvre automatiquement le sous-menu auquel cette page appartient. Je ne souhaite pas le faire de manière automatique, étant donné que le nombre de page ne va pas évolué après la mise en ligne du site, mais ce serait beaucoup plus clair pour l'utilisateur que le sous-menu reste ouvert après qu'il aie clique sur un lien pour aller d'une page à l'autre du site.

Voici le code javascript que j'utilise, contenu dans le fichier javascript.js:
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
 
// Menu Functions & Properties
 
var activeMenu = null;
 
function showMenu() {
  if(activeMenu){
    activeMenu.className = "";
    getNextSiblingByElement(activeMenu).style.display = "none";
  }
  if(this == activeMenu){
    activeMenu = null;
  } else {
    this.className = "active";
    getNextSiblingByElement(this).style.display = "block";
    activeMenu = this;
  }
  return false;
}
 
function initMenu(){
  var menus, menu, text, a, i;
  menus = getChildrenByElement(document.getElementById("menu"));
  for(i = 0; i < menus.length; i++){
    menu = menus[i];
    text = getFirstChildByText(menu);
    a = document.createElement("a");
    menu.replaceChild(a, text);
    a.appendChild(text);
    a.href = "#";
    a.onclick = showMenu;
    a.onLoad = function(){this.blur()};
  }
}
 
if(document.createElement) window.onload = initMenu;
et le code html où j'ai tenté de déplier le premier sous-menu à l'ouverture de la page:
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
 
<html>
<head>
<script type="text/javascript" src="javascript.js"></script> 
<script type="text/javascript">
window.onload = function(){
  var menus, menu, text, a, i;
  menus = getChildrenByElement(document.getElementById("menu"));
    menu = menus[0];
    text = getFirstChildByText(menu);
    this.className = "active";
    getNextSiblingByElement(this).style.display = "block";
    activeMenu = this;
  }
</script>
</head>
 
<body>
<ul id="menu">
  <li> Sous-menu 1
    <ol>
		<li><a href="Notre_role.html" >Notre rôle</a></li>
		<li><a href="Nous_connaitre.html">Nous connaître</a></li>
		<li><a href="Nos_prestations.html">Nos prestations</a></li>
		<li><a href="Notre_savoir_faire.html">Notre Savoir-faire</a></li>
		<li><a href="Notre_philosophie.html" >Notre philosophie</a></li>
		<li><a href="Nous_contacter.html" >Nous contacter</a></li>
    </ol>
  </li>
  <li>Sous-menu 2
    <ol>
      <li><a href="Macro_economie.html">Macro-économie</a></li>
      <li><a href="Etude_produit.html">Études Produits</a></li>
      <li><a href="Appel_d_offre.html">Appel d'offre</a></li>
    </ol>
  </li>
</ul>
</body>
</html>
Je ne comprends pas comment je pourrais faire afin que cela fonctionne comme je veux.

Est-ce que quelqu'un pourrait m'aider svp?


Bien cordialement,
Guiz721