Expanding and collapsing the left navigation in SharePoint 2010

Mehtod 1

 

/* File Created: January 27, 2015 */ $(document).ready(function () {     $('.s4-ql li ul').hide();     //Set the Images up        var Collapse = "/_layouts/images/collapse.gif";     var Expand = "/_layouts/images/expand.gif";     //alert($('.s4-ql ul li').find('ul').length);     $('.s4-ql ul li').find('ul').each(function (index) {         var $this = $(this);         $this.parent().find('>a:first .menu-item-text').parent().parent().parent().prepend(['<a class=\'min\' style=\'float:right; margin-left:5px;margin-top:6px;margin-right:5px;\'><img src=\'/_layouts/images/expand.gif\'/></a>'].join(''));         $this.parent().find('>span:first .menu-item-text').parent().parent().parent().prepend(['<a class=\'min\' style=\'float:right; margin-left:5px;margin-top:6px;margin-right:5px;\'><img src=\'/_layouts/images/expand.gif\'/></a>'].join(''));     });     $('.min').click(function () {         //Get Reference to img            var img = $(this).children();         //Traverse the DOM to find the child UL node            var subList = $(this).siblings('ul');         //Check the visibility of the item and set the image            var Visibility = subList.is(":visible") ? img.attr('src', Expand) : img.attr('src', Collapse); ;         //Toggle the UL            subList.slideToggle();     });     var status = 0;     var currentURL = $(location).attr('href');     if ($(".s4-ql ul li ul li a").length > 0) {         $(".s4-ql ul li ul li a").each(function () {             var eachUrl = $(this).attr('href');             if (currentURL.toLowerCase().indexOf(eachUrl.toLowerCase()) > 0) {                 $(this).parent().parent().parent().find('a:first').click();                 status = 1;             }         });     }     if (status == 0) {         if ($(".s4-ql ul li a").length > 0) {             $(".s4-ql ul li a.menu-item").each(function () {                 var eachUrl = $(this).attr('href');                 //if(eachUrl != undefined)                 {                     if (currentURL.toLowerCase().indexOf(eachUrl.toLowerCase()) > 0) {                         $(this).parent().find('a:first').click();                         status = 1;                     }                 }             });         }     }     if (status == 0) {         //$('.min').click();     } });

 

 

 

Method2

//Mark as hidden
    $('.s4-ql ul.root > li > a.menu-item').attr('data-hide', '1');
    $('.s4-ql ul.root > li > span.menu-item').attr('data-hide', '1');

    //Hide the children
    $('.s4-ql ul.root ul').hide();

    var url = window.location.toString().toLowerCase();

    $('.s4-ql ul.root > li > a.menu-item, .s4-ql ul.root > li > span.menu-item').each(function (index) {

        var $this = $(this);
        var thisURL = $this.attr('href');

        if (thisURL)
            thisURL = thisURL.toLowerCase();

        var menuExpanded = 0;

        if (url.indexOf(thisURL) != -1) {

            showChildren($this);

            menuExpanded = 1;

        }

        if (menuExpanded == 0) {
            $this.next().find('li > a').each(function (j) {

                var childURL = $(this).attr('href');

                if (childURL)
                    childURL = childURL.toLowerCase();

                if (url.indexOf(childURL) != -1) {
                    //alert("menuExpanded false");
                    showChildren($this);
                    menuExpanded = 1;
                    $(this).addClass("selected");
                }

            });
        }
        else {
            //alert();
            //$this.attr('style', "background-image: url('/_LAYOUTS/IHiS.Intranet.DevCentre/Images/arrow_state_blue_down.png');background-repeat: no-repeat");
        }

    });

    function showChildren($this) {

        $this.next().show();
        $this.attr('data-hide', '0');
        $this.attr('style', "background-image: url('/_LAYOUTS/IHiS.Intranet.DevCentre/Images/arrow_state_blue_down.png');background-repeat: no-repeat");
    }

    //Show/Hide when the heading is clicked.
    $('.s4-ql ul.root > li > a.menu-item').bind('click', function (e) {

        var $this = $(this);

        toggleChildrenElems($this);

        e.preventDefault();
    });

    function toggleChildrenElems($this) {

        if ($this.attr('data-hide') == '1') {

            $this.next().show("fast");
            $this.attr('data-hide', '0');
            //window.location.href = $this.attr('href');
            $this.attr('style', "background-image: url('/_LAYOUTS/IHiS.Intranet.DevCentre/Images/arrow_state_blue_down.png');background-repeat: no-repeat");

        }
        else {
            $this.next().hide("fast");
            $this.attr('data-hide', '1');

            $this.attr('style', "background-image: url('/_LAYOUTS/IHiS.Intranet.DevCentre/Images/arrow_state_blue_right.png');background-repeat: no-repeat");
        }
    }

    //Disable the webpart header link

    $('.ms-WPHeaderTd .ms-standardheader a').bind('click', function (e) {

        e.preventDefault();
    });

    if ($.browser && $.browser.msie) {
        var version = parseInt($.browser.version);

        if (version == 7) {
            $('ul#custom-top-nav > li.first_level').bind('mouseover', function (e) {
                var $this = $(this);
                var width = $this.width() + 5;

                var marginStyle = 'margin-left: -' + width + 'px;';

                var $thisDiv = $(this).find("div#top-nav-children");

                $thisDiv.attr("style", marginStyle);

            });
        }
    }