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

5 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();
    });
});

Merci pour vos conseils!