Neovictorian Paisley Menswear

    offcanvas-menu

    0.1.6 • Public • Published

    Off Canvas Menu

    Gitter chat

    devDependencies MIT license Issues


    Check here for a demo.

    Installation

    Bower

    bower install offcanvas-menu --save
    

    NPM

    npm install offcanvas-menu --save
    

    After Bower or NPM install, copy the files from dist/css and dist/js to your project's assets folder.

    Without a Package Manager

    Clone repo, or download zip.

    Usage

    A working sample is available in the download, in the 'dist' folder. Eventually I'll have a Bower and/or NPM installation available. For now clone the repo or download the .zip and copy the CSS and JS files from inside the dist folder, to wherever in your project you would like.

    Here is the expected HTML structure:

    ...
    <head>
        ...
        <link rel="stylesheet" href="path/to/css/offcanvas-nav.min.css">
    </head>
     
    <nav class="offcanvas-nav">
        <ul class="offcanvas-nav__list">
            <li class="offcanvas-nav__item">
                <a href="#" class="offcanvas-nav__link">Item 1</a>
            </li>
            <li class="offcanvas-nav__item">
                <a href="#" class="offcanvas-nav__link">Item 2</a>
            </li>
            <li class="offcanvas-nav__item">
                <a href="#" class="offcanvas-nav__link">Item 3</a>
            </li>
            <li class="offcanvas-nav__item">
                <a href="#" class="offcanvas-nav__link">Item 4</a>
            </li>
            <li class="offcanvas-nav__item">
                <a href="#" class="offcanvas-nav__link">Item 5</a>
            </li>
        </ul>
    </nav>
     
    <a id="nav-toggle" href="#" class="offcanvas-nav__toggle">Menu</a>
    ...
     
        <script src="path/to/js/offcanvas-nav.min.js"></script> 
    </body>

    Development

    Feel free to do what you'd like with this. Clone or fork the repo, type npm install and have your way with it. Use grunt build to compile Less to CSS, and lint and minify JS, and update the dist folder. Use grunt default to run the build, and continue to watch the Less and JavaScript files for changes.

    Coming soon

    • Fallback CSS for older versions of IE - maybe.
    • Bower and/or NPM packages
    • Not much other than that. This thing is pretty basic I think...

    Off-canvas Menu © 2014-2015, Mark Rabey. Released under the MIT License.
    Authored and maintained by Mark Rabey

    markrabey.com  ·  GitHub @MarkRabey  ·  Twitter @MarkRabey

    Keywords

    none

    Install

    npm i offcanvas-menu

    DownloadsWeekly Downloads

    1

    Version

    0.1.6

    License

    MIT

    Last publish

    Collaborators

    • markrabey