J'ai une navigation de style accordéon basée sur jQuery que j'essaie de modifier.Aide à la navigation jQuery requise
Il utilise ce code:
$('.interior #subContent > ul > li > a.drop').click(function(){
$(this).parent().children('ul').toggle("slow");
return false;
});
Je dois pouvoir le garder ouvert à la section de la page active est activée. Je peux mettre en évidence le lien actif avec CSS, mais je pourrais utiliser quelques bons conseils pour le garder ouvert à la section active.
La navigation est la suivante:
<ul>
<li><a href="#" class="drop">Products</a>
<ul>
<li><a href="printing-newproducts.html">New Products</a></li>
<li><a href="printing-inksystems.html">Ink Systems</a></li>
<li><a href="printing-specialtyinks.html">Specialty Inks</a></li>
<li><a href="printing-environmentalinks.html">Environmental Inks</a></li>
<li><a href="printing-whiteplastisolinks.html">White Plastisol Inks</a></li>
<li><a href="printing-plastisolbases.html">Plastisol Bases</a></li>
<li><a href="printing-plastisolinkseries.html">Plastisol Ink Series</a></li>
<li><a href="printing-pvcfreewaterbase.html">Non-PVC Water-Based
System</a></li>
<li><a href="printing-modifersadditives.html">Modifiers & Additives</a></li>
<li><a href="printing-completeproductlisting.html">Complete Product
Listing</a></li>
</ul>
</li>
<li><a href="#" class="drop">Technical Information</a>
<ul>
<li><a href="printing-technicaldatasheets.html">Technical Data Sheets</a></li>
<li><a href="printing-msds.html">MSDS</a></li>
<li><a href="printing-onlinecolorcard.html">Online Color Card</a></li>
<li><a href="printing-mixingsystemsoftware.html">Mixing System Software</a></li>
<li><a href="printing-technicalbulletins.html">Technical Bulletins</a></li>
</ul>
</li>
<li><a href="#" class="drop">Tips & Techniques</a>
<ul>
<li><a href="printing-tradetips.html">Trade Tips</a></li>
<li><a href="printing-galleryoftechniques.html">Gallery of Techniques</a></li>
</ul>
</li>
</ul>
Note: J'essayé de faire cela avec l'accordéon ui jquery, mais j'ai un conflit avec un autre style accordéon sur la page entre autres.
Vous pouvez le voir en action here: C'est la navigation latérale.
Merci pour toute aide.
Votre solution proposée est logique, mais je n'ai pas réussi à la faire fonctionner correctement. Lorsque je clique sur l'élément, la liste s'ouvre mais ne s'ouvre pas à l'action active, et je ne peux pas la refermer sans actualiser la page. – fmz
Je suppose que je ne comprends pas le problème: "Je dois être capable de le garder ouvert à la section sur laquelle la page active est active" Je supposais que ce contrôle serait sur plusieurs pages, et la section correspondante dans la liste est déjà ouverte . – jshalvi
Je l'ai finalement compris. J'ai pris le code original que j'avais et j'ai modifié ce que vous avez ajouté.Voir ma solution finale ci-dessous. Je vais vous donner le crédit pour la réponse parce que je n'aurais jamais compris sans votre contribution. Merci. – fmz