# myTab

**Repository Path**: swfcode/myTab

## Basic Information

- **Project Name**: myTab
- **Description**: 自造轮子 Tab 
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2019-05-30
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# myTab

#### 介绍
原生JavaScript(ES6) 自造轮子 tab

#### 使用介绍

```
<!-- 点击事件 -->
   new Tabs({
        element:document.querySelector('#tabBox'),
        event:'click',
        activeClassName:'on'
    })

<!-- 滑鼠事件 -->

 new Tabs({
     element:document.querySelector('#tabBox'),
     event:'hover',
     activeClassName:'on'
 })

```
element: 目标盒子  必须；
event： 事件 选填 click,hover  默认为 click；
activeClassName: 触发后 的css类型名 默认为 on。

##### 左右移动
```
<!-- tab-left.html -->

<!-- 点击事件 -->
   new Tabs({
        element:document.querySelector('#tabBox'),
        event:'click',
        activeClassName:'on',
        motion:'left',
        duration:'1.5s'
    })

<!-- 滑鼠事件 -->

   new Tabs({
        element:document.querySelector('#tabBox'),
        event:'hover',
        activeClassName:'on',
        motion:'left',
        duration:'1.5s'
    })

```
 motion:    动作 默认是 none,左右移动是 left
 duration:  动作的时间 默认是1s