C2-tabs NPM | npm.io

tabs

Accessible tabs, where aria states are automatically added.

To get Started

CommonJS

$ npm install c2-tabs

var Tabs = require('c2-tabs');

Browser Global

<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
<script src="iife/tabs.js"></script>

Options

Option	Type	Default Value	Info
tablist	string	'.tablist'	refers to the selector on the tablist
target	string	'.tab'	refers to the selector on the tabs
panel	string	'.panel'	refers to the selector on the tab panels
prefix	string	'Tabs-'	sets the prefix for the aria label
hashEnabled	boolean	false	activates tabs based on URL hash (also requires 'data-hash' attribute on each tab)
firstOpen	number	0	tab you want open on page load

API

var tabs = new Tabs('.Tabs');

tabs.on('update', i => {
    console.log('index', i); // index 0, index 1, index 0
});

tabs.activate(0); // activates tab with a specific index
tabs.activateNext();
tabs.activatePrevious();
tabs.destroy();