I'm in direct need of assistance with getting my sites Quick Launch Current Navigation collapsible/accordion. I've tried almost all the preferred code on the web with no success.

I'm unable to find a proper code that would enable this feature.


<script src="/sites/g1/Scripts/jquery%20Codes/jquery-1.11.4.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $("div.menu-vertical>ul.root>li.static>a").toggle(function() {
            $(">ul", $(this).parent()).show("fast");
        }, function() {
            $(">ul", $(this).parent()).hide("fast");
        $("div.menu-vertical>ul.root>li.static>ul.static").css("display", "none");
        var s = $("div.menu-vertical>ul.root>li.static>ul.static>li.selected").parent();
        var p = s.parent();
        p.find('ul').css("display", "");
  • Can you share the code which you have tried?
    – Asad Refai
    Commented May 4, 2016 at 5:57
  • @Asad Refai, thanks for replying to my request for help. I am using the below code.
    – G.IJoe
    Commented May 5, 2016 at 1:18
  • Not required, you can get your query done here on SE.
    – Asad Refai
    Commented May 5, 2016 at 5:53
  • Not sure if applicable to this case but check out Jquery UI. It has an accordion feature that is very nice.
    – Roland
    Commented May 5, 2016 at 5:59
  • @Roland, the accordion I'm using is for my Quicklaunch. It collapses but doesn't expand when clicked. I'm not able to get the toggle function working.
    – G.IJoe
    Commented May 5, 2016 at 16:00

1 Answer 1


Try this code I guess it might work.

$(document).ready(function(){ $(".s4-ql ul.root ul").hide(); $(".s4-ql ul.root > li ").mouseover( function() { $(".s4-ql ul.root ul").hide(); $(this).children(".s4-ql ul.root > li > ul").slideDown("slow"); } ); });

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.