.click function -
.click function -
Hi all, here are my intentions.
1) display defaulted 'tertiarynav' for first subnav item and hide rest
2) when a different subnav is clicked, display it's 'tertirary nav'
3) when the selected / active dropdown is clicked, hide it's contents.
My problem with following script, when clicking the selected / active dropdown, it slides up and back down again.
- $(document).ready(function(){
- $('ul#sidebar li.subnav ul.childnav:not(:first)').hide();
-
- //select anchors in 'subnav' li, but NOT children
- $('.subnav a:not(.childnav a)').click(function(){
- $('.childnav:visible').slideUp('slow');
- $(this).next().slideDown('fast');
- return false; //cancel click through
- });
- });
- <ul id="sidebar">
- <li>Video Library
- <ul>
- <li class="subnav"><a href="#nogo" title="Getting Started">Getting Started</a>
- <ul class="childnav" style="margin-left:20px;padding-right:20px;">
- <li><a href="#nogo" title="How The Referral Program Works">
- How The Referral Program Works</a></li>
-
- <li><a href="#nogo" title="“May I Make a Recommendation?” - How to Ask For a Referral">
- “May I Make a Recommendation?” - How to Ask For a Referral</a></li>
-
- <li><a href="#nogo" title="Talking Points - How To Start the Conversation">
- Talking Points - How To Start the Conversation.</a></li>
-
- <li><a href="#nogo" title="Who We Are - Laughlin Associates">
- Who We Are - Laughlin Associates, <abbr title="Incorporation">inc.</abbr></a></li>
- </ul><!--3-->
- </li><!--2-->
-
- <li class="subnav"><a href="#nogo" title="Understanding Business Entities">Understanding Business Entities</a>
- <ul class="childnav" style="margin-left:20px;padding-right:20px;">
- <li><a href="#nogo">business entities 1</a></li>
- <li><a href="#nogo">business entities 2</a></li>
- <li><a href="#nogo">business entities 3</a></li>
- <li><a href="#nogo">business entities 4</a></li>
- </ul><!--3-->
- </li><!--2-->
-
- <li class="subnav"><a href="#nogo" title="The Corporate Veil Protection Service">The Corporate Veil Protection Service</a></li>
- </ul>
- </li><!--1-->
- </ul><!--End sidebar-->
Any suggestions?
Thanks in advance!