Menu avec sous-catégories [Résolu]

[arthuro45]

Bonsoir,

Savez-vous ou je pourrais de l'aide, lien, pdf... pour concevoir un menu comme sur le site de fnac par exemple, avec de grandes sous-catégorie. Auriez-vous un exemple ?
Mes recherches google n'ont rien données, ou mes mots clé ne sont pas bons.

Merci pour votre aide.

[Vil'Coyote]

c'est un menu déroulant classique à base de balises ul et li

[arthuro45]

Envoyé par Vil'Coyote

c'est un menu déroulant classique à base de balises ul et li

Tout simplement ??

Donc il faut rendre les <ul> extensibles en fonction du contenu comme une div, et on peut y mettre ce qu'on veut ?

[Vil'Coyote]

Envoyé par arthuro45

Tout simplement ??

Donc il faut rendre les <ul> extensibles en fonction du contenu comme une div, et on peut y mettre ce qu'on veut ?

dans les ul tu ne met pas tout et n'importe quoi tu y met des li et dans tes li oui tu met ton texte comme tu le souhaite.
le css fait sont travaille en terme d'affichage, de gestion de couleur, de polices etc ...

[jreaux62]

Bonjour,
puisque tu parles du site de la FNAC, le menu est de la forme :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<div id="MENU">
<ul id="onglets">
	<li id="ong-Menu1">
		<a class="ongLink" href="page1.php">Menu 1</a>
		<div class="megaMenu" style="display: none;">
			contenu du sous-menu 1
		</div>
	</li>
	<li id="ong-Menu2">
		<a class="ongLink" href="page2.php">Menu 2</a>
		<div class="megaMenu" style="display: none;">
			contenu du sous-menu 2
		</div>
	</li>
	<!-- [...] -->
</ul>
</div>

Les sous-menus sont des divs :

Code :

1
2
3
4
5
    position: absolute; /* il faut que les li soient en position:relative; */
    display:none;
    top: 37px;
    width: 514px;
    z-index: 100;

L'affichage se fait ensuite en CSS :
- li:hover -> ca passe en display:block;

Dans ces divs, tu mets le code que tu veux (mise en page de chaque sous-menu)...