1.1.3 • Published 4 years ago

@andy5566/carousel_emomo v1.1.3

Weekly downloads
1
License
ISC
Repository
github
Last release
4 years ago

Carousel_EMOMO

如何使用

npm i @andy5566/carousel_emomo

or

yarn add @andy5566/carousel_emomo

main.js

import '@andy5566/carousel_emomo/carousel_emomo'

Javascript

new carousel_emomo({
    containerName: 'container',
    sliders: 'slider',
    delay: 5,
    numOfControlBar: 4,
    showControlBar: true
})

HTML

<link rel="stylesheet" href="node_modules/@andy5566/carousel_emomo/main.css">
<div class="carousel">
    <a
        class = "slider"
        data-title = "範例一"
        href = "javascript:void(false)"
        style = "background-image: url('YOUR IMG PATH');"
    >
    </a>
    <a
        clas s= "slider"
        data-title = "範例二"
        href = "javascript:void(false)"
        style = "background-image: url('YOUR IMG PATH');"
    >
    </a>
    <a
        class="slider"
        data-title="範例三"
        href="javascript:void(false)"
        style="background-image: url('YOUR IMG PATH');"
    >
    </a>
    <a
        class="slider"
        data-title="範例四"
        href="javascript:void(false)"
        style="background-image: url('YOUR IMG PATH');"
    >
    </a>
</div>

參數(option)

Nametype註解
containerNamestringID名稱或是className
sliderstring要滑動的區塊
delaynumber輪播停留時間, default: 5
showControlBarboolean是否顯示下方控制欄位
numOfControlBarnumber下放控制欄要顯示的數量

##Demo DEMO