Right folks,
After battling with a JQuery Accordion trying to do what I want I think hiding all secondary UL's and only expanding them once a class my CMS sets automatically on lis would be the easiest thing. I want to have accordion type functionality, but it must expand/slide down when that particular ul is active. I have realized that a typical JQuery accordion will not suit, as I will not have toggle li's present in the CMS menu output.
Menu code here:
<ul id="amenu">
<li><a href="anotherpage.html">Home</a></li><li><span class="currentbranch0">
<a href="anotherpage2.html">Content</a></span>
<ul class="multilevel-linkul-0" title="">
<li><a href="subpage.html">Content 2</a></li>
<li><span class="currentbranch1"><a href="subpage.html">Content 3</a></span></li>
</ul>
</li>
//How to target this command to multilevel-linkul-0 class?
$(function(){
$('ul li ul').slideDown();
});
(Fiddle: http://jsfiddle.net/Dmhcq/5/)
-- Updated Fiddle to show exactly what I mean, I only want the secondary UL with currentbranch1 to slideDown
With this code, basically anything with span class "currentbranch1" should slideDown and the rest should remain hidden. I have been looking at sample JQuery code and am completely at a loss even where to start, I'm not a JS programmer :) . So unfortunately above is my best stab at it. If anyone has any advice it would be much appreciated. :)
Cheers
Nick
It's simple. You need to do it the other way around. Find the element that has the class "currentbranch1" and traverse up to the "multilevel-linkul-0" parent and tell that to slide down.
Code
//How to target this command to multilevel-linkul-0 class?
$(function(){
$('.currentbranch1').parents('ul.multilevel-linkul-0').slideDown();
});
Here is an example of Fiddle.
来源:https://stackoverflow.com/questions/15135822/jquery-hide-uls-and-only-expand-once-particular-class-set-bit-like-an-accordion