博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
vue.js无缝滚动
阅读量:7196 次
发布时间: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

你可能感兴趣的文章
引用测试自己的vue组件
查看>>
MAC下几个常用命令行
查看>>
【比原链起步】使用Python与节点rpc通信以及编译比原链智能合约
查看>>
空对象模式
查看>>
javascript系列--javascript深入浅出图解作用域链和闭包
查看>>
读js纯粹笔记
查看>>
JavaScript Array方法 读书笔记(一)
查看>>
Gikee区块链浏览器-BTC链上数据全线下滑,以太坊新增地址孕育希望
查看>>
Vue 基础语法
查看>>
[转载]基于Redis的分布式锁到底安全吗?
查看>>
Mysql知识点整理
查看>>
mysql基础
查看>>
红黑树上
查看>>
微信小程序高级基础
查看>>
java b2b2c o2o spring cloud spring boot 商城系统-系统平台功能导图
查看>>
String、StringBuffer、StringBulider比较和使用
查看>>
讲述我在阿里六面的经历,分享给大家(Java岗)
查看>>
Flutter Widget简介
查看>>
静态资源缓存机制之利用HTTP缓存
查看>>
iOS逆向(2)-密码学(Hash&对称加密)
查看>>