博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
vue.js无缝滚动
阅读量:7197 次
发布时间:2019-06-29

本文共 1069 字,大约阅读时间需要 3 分钟。

一个简单的基于vue.js的无缝滚动

? ? ?

安装

NPM

npm install vue-seamless-scroll --save复制代码

使用

ES6

详情的demo页面

// **main.js**import Vue from 'vue'import scroll from 'vue-seamless-scroll'Vue.use(scroll)
// 或者你可以自己设置全局注册的组件名 默认注册的组件名是 vue-seamless-scrollVue.use(scroll,{
componentName: 'scroll-seamless'})
复制代码

普通的使用方法 (script标签引入)

Example:

详情的demo页面

  ...  
复制代码

配置项默认值

defaultOption () {        return {          step: 1, //数值越大速度滚动越快          limitMoveNum: 5, //开始无缝滚动的数据量  //this.dataList.length          hoverStop: true, //是否开启鼠标悬停stop          direction: 1, // 0向下 1向上 2向左 3向右          openWatch: true, //开启数据实时监控刷新dom          singleHeight: 0, //单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1          singleWidth: 0, //单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3          waitTime: 1000 //单步运动停止的时间(默认值1000ms)        }      }复制代码

历史版本

See the GitHub .

注意

如果你想要js无缝滚动(无依赖)你可以切换到这里。

License

vue-simple-spinner is open source and released under the .

TKS

发现bug或者有什么不足望指点,感觉不错点个star吧。

转载于:https://juejin.im/post/5a689b0f51882573385fe934

你可能感兴趣的文章