Aller au contenu

affichage de sous-menu


Guest Jeanst32167

Sujets conseillés

Guest Jeanst32167

Bonjour,

je souhaite faire sur mon site un menu avec sous-menus qui s'affichent et disparaisent sans rechargé la page.

j'ai trouvé un script qui le permet:

<script>
function afficheId(baliseId)
{
if (document.getElementById && document.getElementById(baliseId) != null)
{
document.getElementById(baliseId).style.visibility='visible';
document.getElementById(baliseId).style.display='block';
}
}
function cacheId(baliseId)
{
if (document.getElementById && document.getElementById(baliseId) != null)
{
document.getElementById(baliseId).style.visibility='hidden';
document.getElementById(baliseId).style.display='none';
}
}
</script>

Le menu et les sous-menus à afficher:

<a onclick="afficheId('menu1');" onmouseout="cacheId('menu1');">Joueur</a>
<a onclick="afficheId('menu2');" onmouseout="cacheId('menu2');">Maitre de jeu</a>
<a onclick="afficheId('menu3');" onmouseout="cacheId('menu3');">Modérateur</a>
<a onclick="afficheId('menu4');" onmouseout="cacheId('menu4');">Administration</a>
<br>

<ul id="menu1" onmouseover="afficheId('menu1');" onmouseout="cacheId('menu1');">
<a href="http://www.site.com/">lien a1</a>
<a href="http://www.site.com/">lien a2</a>
<a href="http://www.site.com/">lien a3</a>
<a href="http://www.site.com/">lien a4</a>
</ul>
<ul id="menu2" onmouseover="afficheId('menu2');" onmouseout="cacheId('menu2');">
<a href="http://www.site.com/">lien b1</a>
<a href="http://www.site.com/">lien b2</a>
</ul>
<ul id="menu3" onmouseover="afficheId('menu3');" onmouseout="cacheId('menu3');">
<a href="http://www.site.com/">lien c1</a>
<a href="http://www.site.com/">lien c2</a>
<a href="http://www.site.com/">lien c3</a>
</ul>
<ul id="menu4" onmouseover="afficheId('menu4');" onmouseout="cacheId('menu4');">
<a href="http://www.site.com/">lien d1</a>
<a href="http://www.site.com/">lien d2</a>
<a href="http://www.site.com/">lien d3</a>
</ul>

Le script fonctionne bien, mais il ne répond pas parfaitement à mes besoin.

Les problèmes:

1- tous les sous-menus s'affichent à l'ouverture de la page

2- je voudrais afficher par défaut un sous-menu spécifique selon la page

3- il faut remplacer le "onmouseout" par autre chose

Ce que je voudrais que le script fasse:

Qu'à l'ouverture de la page, seulement le sous-menu désigné s'ouvre. Ce menu sera dans un fichier inclut dans mes page en PHP, je dois pouvoir choisir le sous-menu par défaut avec une variables PHP ( j'suis sur à 99% que ça se fera en changent le nom du sous-menu par la variables :P )

Je voudrais aussi remplacer le "onmouseout" par autre chose, pour qu'un sous-menu disparaisse seulement quand on en choisi un autre.

Merci à qui voudra bien m'aider :)

Jean-Seb

Modifié par Jeanst32167
Lien vers le commentaire
Partager sur d’autres sites

Guest Jeanst32167

Bien sur je ne demande pas de me faire le script (à moin que quelqu'un veulle le faire :whistling: )

Mais si vous connaissez des bon site pour apprendre à faire ce genre de script ou bien des truc simple à y changer, j'en serais bien content.

Lien vers le commentaire
Partager sur d’autres sites

Guest Jeanst32167

J'ai finalement trouvé une première solution qui était assé logique voir même stupide :blush:

J'ai simplement ajouté dans les Onclick les fonction de fermeture des autres menus:

<a onclick="afficheId('menu1'); cacheId('menu2'); cacheId('menu3'); cacheId('menu4');">Joueur</a>
 <a onclick="afficheId('menu2'); cacheId('menu1'); cacheId('menu3'); cacheId('menu4');">Maitre de jeu</a>
 <a onclick="afficheId('menu3'); cacheId('menu1'); cacheId('menu2'); cacheId('menu4');">Modérateur</a>
 <a onclick="afficheId('menu4'); cacheId('menu1'); cacheId('menu2'); cacheId('menu3');">Administration</a>

J'aurrais dû me familiariser un peu plus avec les Onclick et autres avant de venir posté :P

Mais mon second problème persiste encore:

Comment préciser quel menu doit être visible à l'ouverture de la page et empêcher les autres de s'afficher?

Ce ne sera peut-être pas grace à CSS. Mais peut-être avec une fonction semblable à Onclick.

Est-ce que OnOpen existe?

édit:

Je vien de voir que oui mais comment l'utiliser?

Modifié par Jeanst32167
Lien vers le commentaire
Partager sur d’autres sites

Guest Jeanst32167

Merci pour toutes cette aide, elle ma été bien utile :P

C'étais l'évenement Onload que je devais utiliser dans la balise body en y ajoutant les fonctions de fermeture de tous les menus plus la fonction d'ouverture d'un menu qui est précisé par PHP.

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...