js seamless scrolling（js无缝滚动）
js seamless-scroll plugin
sample demo | 中文文档
Browser support IE |
 Firefox |
 Chrome |
 Safari |
 iOS |
 Android |
|---|---|---|---|---|---|
| IE7+ | ✓ | ✓ | ✓ | ✓ | ✓ |
npm install seamscroll --save CDN
https://cdn.jsdelivr.net/npm/seamscroll@0.0.11/build/seamscroll.min.js
const seamless = require('seamscroll') `or` import seamless from 'seamscroll' seamless.init({ dom: document.getElementById('demo1') }) //script tag <script src="seamscroll.min.js"></script> <script> seamless.init({ dom: document.getElementById('demo1') }) </script> Demo
.demo2 { width: 600px; height: 100px; position: relative; overflow: hidden; margin-top: 100px; } .list2 li { float: left; width: 100px; height: 100px; margin-right: 20px; text-align: center; font-size: 20px; color: #fff; line-height:100px; background-color: #ccc; }
<div class="demo2"> <ul class="list2 clearfix" id="demo2"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> </ul> </div>
<script src="seamscroll.min.js"></script> seamscroll.init({ dom: document.getElementById('demo2'), direction: 2 }) Configure
*Required parameters(dom)
| key | description | default | val |
|---|---|---|---|
*dom |
the role of the element | null |
dom |
step |
step,the faster the rolling speed is faster | 1 |
Number |
hoverStop |
mouse hover control is enabled | true |
Boolean |
direction |
0 down 1 up 2 left 3 right | 1 |
Number |
singleHeight |
one single stop height(default zero is seamless) => direction 0/1 | 0 |
Number |
singleWidth |
one single stop width(default zero is seamless) => direction 2/3 | 0 |
Number |
waitTime |
one single data stop wait time(1s) | 1000 |
Number |
See the GitHub release history.
Licenseseamless-scroll is open source and released under the MIT License.
版权声明：
1、该文章(资料)来源于互联网公开信息，我方只是对该内容做点评，所分享的下载地址为原作者公开地址。2、网站不提供资料下载，如需下载请到原作者页面进行下载。
