jQuery Plugin To Create An Animated Side Toolbar - Vcore Sidebar
File Size: | 9.83 KB |
---|---|
Views Total: | 4333 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

Vcore Sidebar is a tiny jQuery plugin which allows you to create an animated, fixed and vertical side toolbar on your web page. Hover over the toolbar icon you will see a text label sliding out from the toolbar to display more information.
How to use it:
1. Load the latest version of jQuery JavaScript library from a CDN.
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
2. Load the jQuery Vcore Sidebar plugin on the webpage. Make sure the vcore.sidebar.js
is loaded after the jQuery library.
<link rel="stylesheet" href="vcore.sidebar.css"> <script src="vcore.sidebar.js"></script>
3. Append a toolbar to a DOM element and set the items using 'items' JS array.
$(function(){ $('body').vSidebar({ 'items': [ { link: '#1', 'iconUrl':'images/icon-phone.png', 'label':'Label Text 1' }, { link: '#2', 'iconUrl':'images/icon-guide.png', 'label':'Label Text 2' }, { link: '#3', 'iconUrl':'images/icon-cart.png', 'label':'Label Text 3' } ] }); });
4. All the default customization options.
// an array of items 'items': null, // where to postion the sidebar 'position': 'right bottom', // horizontal magrin 'horizontalMargin': 200, // vertical margin 'verticalMargin': 0,
This awesome jQuery plugin is developed by vyquanghoa. For more Advanced Usages, please check the demo page or visit the official website.