jQuery Plugin To Create Side Sliding Drawers - drawer

A jQuery & jQuery UI based drawer plugin that creates floating, sliding side panels to manage hiding and showing of html content like menus, feedback forms and more.

How to use it:

1. The plugin requires jQuery and jQuery UI libraries.

<link rel="stylesheet" href="/path/to/jquery-ui.css">
<script src="/path/to/jquery.min.js"></script>
<script src="/path/to/jquery-ui.min.js"></script>

2. Download and include the jQuery drawer plugin's JS & CSS after jQuery.

<link rel="stylesheet" href="css/jquery.drawer.css">
<script src="js/jquery.drawer.js"></script>

3. Create a drawer panel that will be positioned on the left hand side of your screen.

<div id="left-drawer" class="drawer-content-left">
</div>

4. Initialize the plugin and done.

$('#left-drawer').drawer({
  align: 'left'
});

5. Make the drawer panel sticky whatever you scroll down / up the webpage.

$('#left-drawer').drawer({
  align: 'left',
  type: 'normal'
});

6. Set the top/right/bottom/left offsets.

$('#left-drawer').drawer({
  align: 'left',
  type: 'normal',
  top: '150px'
});

7. Adjust the drawer handle size.

$('#left-drawer').drawer({
  align: 'left',
  type: 'normal',
  top: '150px',
  handleSize: '50%'
});

---

This awesome jQuery plugin is developed by rahool. For more Advanced Usages, please check the demo page or visit the official website.