5.0.0 • Published 4 years ago

jtabs v5.0.0

Weekly downloads
13
License
MIT
Repository
github
Last release
4 years ago

jTabs

Tabs in pure JavaScript.

Demo: http://redvi.github.io/jTabs

How to use

$ npm install --save jtabs

Include these files in your project (with gulp/webpack/etc) and import them.

Markup example

<section class="tabs-container">
    <div class="tabs-buttons">
        <button class="tabs-buttons__btn tabs-buttons__btn_active">HTML</button>
        <button class="tabs-buttons__btn">CSS</button>
    </div>

    <div class="tabs-sections">
        <div class="tabs-sections__section tabs-sections__section_active">
            <p>Text</p>
        </div>
        <div class="tabs-sections__section">
            <p>Another text</p>
        </div>
    </div>
</section>

Scripts

import { JTabs } from 'jtabs';
import 'jtabs/lib/jtabs.min.css';

const tabs = new JTabs({ container: '.tabs-container' });
tabs.init();

Options

OptionDefault value
container'.tabs-container'
button'.tabs-buttons__btn'
tab'.tabs-sections__section'
activeBtnClass'tabs-buttons__btn_active'
activeTabClass'tabs-sections__section_active'

Development

$ npm i -g static-server typescript
$ npm run compile && static-server lib
5.0.0

4 years ago

4.0.1

8 years ago

4.0.0

8 years ago

3.0.3

8 years ago

3.0.2

8 years ago

3.0.1

9 years ago

3.0.0

9 years ago

2.0.2

9 years ago

2.0.1

9 years ago

1.0.1

9 years ago

1.0.0

9 years ago