0.0.0 • Published 6 years ago
ds-tab v0.0.0
ds-tab ( Don't Need jQuery )
ds-tab.js は、jQueryを必要としないタブ機能のライブラリです。
- Target browser : IE9+
- IE9の場合は transition 無しでタブが表示されます。
Install
npm i ds-tab -SImport
import DsTab from 'ds-tab';Constructor
new DsTab(element [, option]);| Argument | Data type | Default | Descroption |
|---|---|---|---|
| element | String | -(Required) | 対象要素を指定します。ex) ".tab" |
| option | Object | - | ex) option = { fadeSpeed: 100, btnElm: "ul li a", detailElm: "div"} |
| Option | Data type | Default | Descroption |
|---|---|---|---|
| fadeSpeed | Number | 0 | 表示スピードを調節できます。 |
| btnElm | String | ".tab_btn"(“.tab”の場合) | ボタンとなる要素を指定できます。 |
| detailElm | String | ".tab_detail"(“.tab”の場合) | 内容となる要素を指定できます。 |
Method
| Method | Argument | Descroption |
|---|---|---|
| Open( element ) | String | element で指定したタブを開きます。 |
| OpenEnd = function(){}; | - | タブが開いた後に実行されます。 |
Demo
https://dsflon.github.io/ds-tab/
import DsTab from 'ds-tab';
let dsTab = new DsTab('.tab');
//
let dsTab2 = new DsTab(
'.tab2',
{
fadeSpeed: 600
}
);
dsTab2.Open( ".open" );
dsTab2.OpenEnd = function(){
console.log("OpenEnd");
};0.0.0
6 years ago