jquery-toggle-sidebar.js

// JQuery Toggle Sidebar Plugin by Taufik Nurrohman
// https://plus.google.com/108949996304093815163/about
// See: http://jsfiddle.net/tovic/z9Nen/embedded/result,js,html,css/

(function($) {
        $.fn.toggleSidebar = function(config) {

                config = $.extend({
                        expand: "#main-wrapper",  // Your expandable element
                        hideText: "Hide Sidebar", // Toggle button label when the sidebar is visible
                        showText: "Show Sidebar", // Toggle button label when the sidebar is hidden
                        animated: false,          // If true, then the animation will be enabled
                        animateSpeed: 400,        // Your animation speed
                        extraWidth: 0,
                        easingType: null,         // Your animation easing type
                        enableCookie: false,      // If true, the browser will save the 'hidden/visible sidebar' session (JavaScript Cookie is required!)
                        cookieName: 'sidebar-session',
                        expires: 7000,
                        insertNav: true,           // Automatically insert a toggle button above the sidebar (column)
                        defaultHidden: false       // If true, the sidebar will be hidden by default
                }, config);

                // Build a toggle button above the sidebar
                if(config.insertNav) {
                        $(config.expand).before('<div id="sidebar-toggler-wrapper"><a class="sidebar-toggler from-js" href="#">' + config.hideText + '</a><div style="clear:both;"></div></div>');
                }

                var $this = this,
                        $toggler = $('.sidebar-toggler'),
                        sidebarWidth = $this.outerWidth() + config.extraWidth, // width + padding + border-width (if any) + extra_width
                        expanderWidth = $(config.expand).width(); // width

                function hideSidebar() {
                        if(config.animated) {
                                $this.stop(true,true).fadeOut(config.animateSpeed/2, function() {
                                        $(config.expand).animate({width:expanderWidth+sidebarWidth}, config.animateSpeed, config.easingType);
                                });
                        } else {
                                $this.hide();
                                $(config.expand).css('width', expanderWidth+sidebarWidth);
                        }
                        if(config.enableCookie) {
                                if(!config.defaultHidden) {
                                        createCookie(config.cookieName, null, config.expires);
                                } else {
                                        eraseCookie(config.cookieName);
                                }
                        }
                }
                function showSidebar() {
                        if(config.animated) {
                                $(config.expand).stop().animate({width:expanderWidth}, config.animateSpeed, config.easingType, function() {
                                        $this.fadeIn(config.animateSpeed);
                                });
                        } else {
                                $this.show();
                                $(config.expand).css('width', expanderWidth);
                        }
                        if(config.enableCookie) {
                        if(!config.defaultHidden) {
                                        eraseCookie(config.cookieName);
                                } else {
                                        createCookie(config.cookieName, null, config.expires);
                                }
                        }
                }

                if(config.defaultHidden) {
                        if(readCookie(config.cookieName)) {
                                $toggler.removeClass('active').html(config.hideText);
                                $this.show();
                                $(config.expand).css('width', expanderWidth);
                        } else {
                                $toggler.addClass('active').html(config.showText);
                                $this.hide();
                                $(config.expand).css('width', expanderWidth+sidebarWidth);
                        }
                } else {
                        if(readCookie(config.cookieName)) {
                                $toggler.addClass('active').html(config.showText);
                                $this.hide();
                                $(config.expand).css('width', expanderWidth+sidebarWidth);
                        }
                }

                $toggler.on("click", function() {
                        if($this.is(':hidden')) {
                                showSidebar();
                                $(this).removeClass('active').html(config.hideText);
                        } else {
                                hideSidebar();
                                $(this).addClass('active').html(config.showText);
                        }
                        return false;
                });

        };
})(jQuery);