# stylie.tabs 100% width tabbed content with some example media queries for smaller screens. Inspired by [Responsive full width tabs](http://tympanus.net/codrops/2014/03/21/responsive-full-width-tabs/) [API Documenation](https://github.com/typesettin/stylie.tabs/blob/master/doc/api.md) ## Example Check out `example/index.html`, the example javascript for the example page is `resources/js/example_src.js` ## Installation ``` $ npm install stylie.tabs ``` The tab component is a browserify javascript module. ## Usage *JavaScript* ```javascript var StylieTabs = require('stylie.tabs'), myTabs; //initialize nav component after the dom has loaded window.addEventListener('load',function(){ var tabelement = document.getElementById('tabs'); myTabs = new StylieTabs(tabelement); //expose your nav component to the window global namespace window.myNav = myNav; }); ``` *HTML* ```html Your Page
any html
can go in here
this is fully responsive
``` ##API ```javascript myNav.showTab(1); //show tab at index '1' ``` ##Development *Make sure you have grunt installed* ``` $ npm install -g grunt-cli ``` Then run grunt watch ``` $ grunt watch ``` For generating documentation ``` $ grunt doc $ jsdoc2md lib/**/*.js index.js > doc/api.md ``` ##Notes * The Tab Module uses Node's event Emitter for event handling. * The Template Generator uses EJS, but you can generate your own mark up * The less file is located in `resources/stylesheets`