Bonjour à tous.
J'ai suivi le tuto jQuery : Menu Accordéon et je souhaite le modifier mais étant limitée dans la programmation Jquery, je fais appel à vous!
En fait je souhaiterais faire un menu qui se déroule avec des + et pouvoir faire pointer chaque titre de menu vers une page spécifique :
<div id="navigation">
<div class="bloc">
<span class="ascenseur">+</span><a href="categorie1.html">Catégorie 1</a></div>
<ul>
<li>ss-cat1.1</li>
<li>ss-cat1.2</li>
</ul>
</div>
<div>
<span class="ascenseur">+</span><a href="categorie2.html">Catégorie 2</a></div>
<ul>
<li>ss-cat2.1</li>
<li>ss-cat2.2</li>
</ul>
</div>
</div>
</div>
J'ai testé avec $(".ascenseur ").nextAll("ul:first").hide(); mais ça ne fonctionne ni sous ie ni sous ff...
Avez-vous une petite idée svp??
merci d'avance pour vos réponses
Salut !
Aucune certitude mais enlève un peu le :first pour voir.
et surtout, tu as oublié de mettre le comportement quand on vient sur ton ascenseur.
Merci pour ta réponse, j'ai testé en enlevant le :first, pas plus de résulats.
Pour le comportement de mon ascenseur mon code est le suivant:
jQuery().ready(function(){
$(".ascenseur").nextAll("ul:first").hide();
$(".ascenseur").click(function(){
if($(this).next("div").is(":hidden")){
$(".ascenseur").next("ul:visible").slideUp();
$(this).next("ul").slideDown();
}
});
});
je ferais ça comme ça : met une classe particulière à ton ul. ici je choisi "menu".
$(function(){
$(".menu").hide();
$(".ascenseur").click(function(){
if($(this).next(".menu:first").hide()){
$(".menu").hide();
$(this).slideUp();
}
});
});
Sans certitude car je n'ai pas de quoi tester ici.
c'est simple mais j'ai deux modif pour ton cote pour que les choses soit clair:
1 - pour tes ul je te conseille d'ajouté des id exp (cat_1, cat_2)
2 - pour la balise a ajouter un title qui contiendra l'id de son sous catégorie
$(document).ready(function(){
$('navigation a').click(function(){
var sous_categorie = $(this).attr('title');
$('navigation ul').slideUp();
$('#'+sous_categorie).slideDown();
});
});