Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Slidebar Menu plugin in Jquery

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 250
    Comment on it

    We can create a slidebar menu using jquery slidebar plugin. It is a jQuery plugin that gives a slidebar menu for easily implementing in the web pages.

    We have to include slidebars.js in our source files.

    Here is an example that shows how to implement this plugin:

    <!doctype html>
    <html>
    
       <head>
          <title>Slidebars Menu</title>
          <meta name = "viewport" content = "width = device-width, 
             initial-scale = 1.0, minimum-scale = 1.0, 
             maximum-scale = 1.0, user-scalable = no">
          <link rel = "stylesheet" href = "slidebars.css">
          <link rel = "stylesheet" href = "example-styles.css">
       </head>
    
       <body>
    
          <div id = "sb-site">
    
             <ul>
                <li class = "sb-toggle-left">Click here to slide menu</li> 
             </ul>
          </div>
    
          <div class = "sb-slidebar sb-left sb-style-push">
             <p>1</p>
             <hr/>
             <p>2</p>
             <hr/>
             <p>3</p>
             <hr/>
             <p>4</p>
             <hr/>
          </div>
    
          <script 
             src = "http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>    
          <script src = "slidebars.js"></script>
    
          <script>
             (function($) {
                $(document).ready(function() {
                   $.slidebars();
                });
             }) (jQuery);
          </script>
    
       </body>
    
    </html>
    

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: