Suwa
📖 Like a carousel element
Install or Download
yarn add suwa
npm i -S suwa
Or access to releases page.
Then, download the latest version.
Usage
First, if you read as a separate file
<script src="/path/tp/suwa.js"></script>
<div id="target">
<div class="page1" style="display:none">...</div>
<div class="page2" style="display:none">...</div>
<div class="page3" style="display:none">...</div>
<div class="page." style="display:none">...</div>
<div class="page." style="display:none">...</div>
<div class="page." style="display:none">...</div>
<div class="pageN" style="display:none">...</div>
</div>
import Suwa from 'suwa';
window.addEventListener('load', () => {
new Suwa({
target: getElementById('target'),
data: {
style: {
height: '50vh',
width: '100vw',
baseColor: '#fff',
subColor: '#222',
accentColor: '#cb1b45'
},
progress: true,
pagerLoop: {
autoScroll: 3000,
},
keyMaps: {
prevPage: 37,
nextPage: 39
},
wheel: true
pager: {
inset: true
},
}
});
})
Example
test/fixtures/index.js
example/webpack/index.js
LICENSE
The MIT License (MIT)
Copyright (c) 2017 nju33 nju33.ki@gmail.com