Menu deroulant avec sous-menu (CMS)
Bonjour a tous,
j'ai crée un menu déroulant pour un site web.
Quand je clique sur un sous menu il apparait bien mais ne fait pas descendre le reste du menu.
Je travail avec un cms, donc je ne peut pas acceder au menu de navigation.
Comment je peut faire svp ?
Code:
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
| #topmenu
{
margin-left: -10px;
width: 292px !important;
height: 30px !important;
background: #1265A9;
}
#menu {
margin: 0;
padding: 0;
margin-top: -5px;
width: 280px;
list-style: none;
font-weight: bold;
color: #126 5A9;
width: 200px;
}
#menu a, #menu span {
display: block;
padding: 4px 10px;
text-decoration: none !important;
}
#menu a:hover, #menu a:focus, #menu a:active {
text-decoration: underline;
}
#menu .small {
font-size: .8em;
font-size: .9em;
margin: 0;
padding: 0;
}
#menu ul.small a {
background: none;
padding: 3px 20px;
} |
et le code jQuery
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20
| jQuery(document).ready( function () {
if (window.matchMedia("(max-width: 768px)").matches) {
jQuery(".navigation ul.small:not('.open_at_load')").hide();
jQuery(".navigation li.deeper span").each( function () {
var TexteSpan = jQuery(this).text();
jQuery(this).replaceWith('<a href="" title="Afficher le sous-menu">' + TexteSpan + '<\/a>') ;
} ) ;
jQuery(".navigation li.deeper > a").click( function () {
if (jQuery(this).next("ul.small:visible").length != 0) {
jQuery(this).next("ul.small").slideUp("normal");
}
else {
jQuery(".navigation ul.small").slideUp("normal");
jQuery(this).next("ul.small").slideDown("normal");
}
return false;
});
}
} ) ; |
comme je travaille en local je ne peut pas vous donner le lien mais j'ai une petite video qui montre le probleme :https://www.youtube.com/watch?v=R8AC...ature=youtu.be
Merci d'avance