Fork me on GitHub

jQuery Sidebar

A stupid simple sidebar jQuery plugin.

Download .zip Download .tar.gz View on GitHub

Usage

This library depends on jQuery.

Include the script file in your HTML page:

...
<script src="path/to/jQuery-sidebar.min.js"></script>
...
<div class="sidebar left">Hello World</div>
<div class="sidebar right">I am on right!</div>
<div class="sidebar top">I am on top!</div>
<div class="sidebar bottom">I am on bottom!</div>
...
<script>
    // Sidebar on left (default)
    $(".sidebar.left").sidebar().trigger("sidebar:open");

    // Sidebar on right side
    $(".sidebar.right").sidebar({side: "right"});

    // Sidebar on top side
    $(".sidebar.top").sidebar({side: "top"});

    // Sidebar on bottom side
    $(".sidebar.bottom").sidebar({side: "bottom"});
</script>
...

Also, please note that you must write your own CSS code for the sidebars. You can find a CSS code example here.

Check out the documentation on the GitHub page.

Demo

Toggle sidebars

Toggle Left Toggle Top Toggle Right Toggle Bottom

Open sidebars

Open Left Open Top Open Right Open Bottom

Close sidebars

Close Left Close Top Close Right Close Bottom