Menu sur plusieurs niveaux
lunagato
Messages postés
252
Statut
Membre
-
NDOUKI Messages postés 110 Date d'inscription Statut Membre Dernière intervention -
NDOUKI Messages postés 110 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
Bonjour,
Je suis actuellement bloqué sur un tout petit problème, j'ai créé un menu sur plusieurs niveaux, c'est à dire une ligne de lien, et quand on survole un lien une nouvelle ligne apparait mais en relative, pas en absolute. Et, tout marche le problème c'est quand on quitte la zone survolable le menu ne disparait pas.
voici le html :
le javascript :
Je vous remercie d'avance de votre aide
Bonjour,
Je suis actuellement bloqué sur un tout petit problème, j'ai créé un menu sur plusieurs niveaux, c'est à dire une ligne de lien, et quand on survole un lien une nouvelle ligne apparait mais en relative, pas en absolute. Et, tout marche le problème c'est quand on quitte la zone survolable le menu ne disparait pas.
voici le html :
<div id="tabs-container">
<ul class="tabs">
<li class="active"><a href="#">Section one</a></li>
<li><a href="#">Section two</a></li>
<li><a href="#">Section three</a></li>
<li><a href="#">Section four</a></li>
</ul>
</div>
<!-- defining top menu -->
<div id="nav-container">
<ul class="nav" id="1">
<!-- defining top menu elements -->
<li><a href="https://www.script-tutorials.com/">Home</a></li>
<li><a href="#">Menus s#3</a>
</li>
</ul>
<ul class="nav" id="2" style="display:none;">
<li><a href="#">Menus #5</a></li>
<li><a href="#">Menus #6</a></li>
<li><a href="#">Menus #7</a></li>
</ul>
<ul class="nav" id="3" style="display:none;">
<li><a href="#">Menus #8</a></li>
<li><a href="#">Menus #9</a></li>
<li><a href="#">Menus #10</a></li>
</ul>
<ul class="nav" id="4" style="display:none;">
<li><a href="#">Menus #11</a></li>
<li><a href="#">Menus #12</a></li>
</ul>
</div>
le javascript :
$(document).ready(function(){
$('.tabs li a').hover(function () {
$('.tabs li').removeClass('active');
$(this).parent().addClass('active');
$('.nav').hide();
var index = $('.tabs li a').index(this);
$('.nav').eq(index).show();
return false;
});
$('.nav li').has('ul').hover(function(){
$(this).addClass('current').children('ul').fadeIn();
}, function() {
$(this).removeClass('current').children('ul').hide();
});
});
Je vous remercie d'avance de votre aide
A voir également:
- Menu sur plusieurs niveaux
- Menu déroulant excel - Guide
- Canon quick menu - Télécharger - Utilitaires
- Excel liste déroulante en cascade 2 niveaux - Guide
- Windows 11 menu contextuel classique - Guide
- Windows 11 menu démarrer classique - Guide