fafaz-tab

1.0.7 • Public • Published

fafaz-Tab

fafaz-Tab is a lightweight tab plugin with no dependencies (3KB minified / 1.3KB gzipped)


Instructions

common

<body>
    <div class="tab" hidden>
        <div class="tab-header">
            <div class="tab-header__item">title 1</div>
            <div class="tab-header__item">title 2</div>
            <div class="tab-header__item">title 3</div>
        </div>
        <div class="tab-body">
            <div class="tab-body__item">content 1</div>
            <div class="tab-body__item">content 2</div>
            <div class="tab-body__item">content 3</div>
        </div>
    </div>
</body>

basic usage

<body>
  .
  .
  .

    <script src="path/Tab.min.js"></script>
    <script>
        var myTab = new fafaz.Tab.default('.tab');
    </script>
</body>

package manager + babel compiler

npm install --save fafaz-tab or yarn add fafaz-tab

import Tab from 'fafaz-tab';

const myTab = new Tab('.tab');



Events

var myTab = new fafaz.Tab('.tab');

myTab.on('change', ({ idx, container }) => {
    console.log(idx, container);
})



Compatibility

IE10+ (this library uses css flexbox)



License

MIT

Package Sidebar

Install

npm i fafaz-tab

Weekly Downloads

5

Version

1.0.7

License

MIT

Unpacked Size

9.08 kB

Total Files

8

Last publish

Collaborators

  • fafaz