npm安装地址 https://www.npmjs.com/package/vue-seamless-scroll

命令行执行:

npm install vue-seamless-scroll --save

然后在main.js文件里面引入使用:

import scroll from 'vue-seamless-scroll'
Vue.use(scroll)

在页面使用参考地址: https://chenxuan1993.gitee.io/component-document/index_prod#/component/seamless-default

里面有详细的参数及代码案例:直接复制到项目里面即可显示:

遇到的问题:

1. 复制案例的样式:会出现滚动内容不衔接的情况

.seamless-warp {
height: 229px;
overflow: hidden;
}

2. 然后在上面的css中添加行高就不会出现切断的现象了

vue的无缝滚动插件vue-seamless-scroll的安装与使用的更多相关文章

  1. vue的无缝滚动插件vue-seamless-scroll的使用

    https://chenxuan0000.github.io/component-document/index_prod.html#/component/seamless-others 在vue环境下 ...

  2. 基于vue的无缝滚动组件

    vue-seamless-scroll A simple, Seamless scrolling for Vue.js 在awesome上一直没有发现vue的无缝滚动组件,在工作之余写了个组件,分享出 ...

  3. vue实现无缝滚动

    vue实现无缝滚动 标签部分 <div style="height: 260px; width: 50%;display: inline-block;float: right; ove ...

  4. 手写JS无缝滚动插件

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  5. liMarquee – jQuery无缝滚动插件(制作跑马灯效果)

    liMarquee 是一款基于 jQuery 的无缝滚动插件,类似于 HTML 的 marquee 标签,但比 marquee 更强大.它可以应用于任何 Web 元素,包括文字.图像.表格.表单等元素 ...

  6. 利用jQuery无缝滚动插件liMarquee实现图片(链接)和文字(链接)向右无缝滚动(兼容ie7+)

    像新闻类的版块经常要求一条条的新闻滚动出现,要实现这种效果,可以使用jQuery无缝滚动插件liMarquee. 注意: 1. 它的兼容性是IE7+,及现代浏览器. 2. 引用的jquery的版本最好 ...

  7. vue插件 vue-seamless-scroll 无缝滚动插件ES6使用总结

    最近因为需求需要写一个项目信息无缝向上滚动组件,在网上搜了一下,看到大家的一致好评就果断的使用了vue-seamless-scroll组件.下面就简单的介绍它的使用,具体详细的使用推荐大家去看下开发者 ...

  8. Vue 消息无缝滚动

    vue实现消息向上无缝滚动效果 <ul class="new-list" :class="{anim:animate}" @mouseenter=&quo ...

  9. 一款经典的jQuery kxbdMarquee 无缝滚动插件

    <marquee> 曾是 IE 下独有的一个走马灯效果的标签,其他浏览器并不兼容,于是出现了使用 JavaScript 来模拟该效果的插件. 版本: jQuery v1.3.2+ 在线实例 ...

随机推荐

  1. break MISSING_BLOCK_LABEL_160; 看源代码出现的,源代码是反编译的

    break MISSING_BLOCK_LABEL_160; FileNotFoundException fnfe; fnfe; out.close(); throw fnfe; in.close() ...

  2. Cookis与文件缓存的区别

    我是一位顶尖的网络专家.稍后更新...

  3. Python模拟登陆淘宝并统计淘宝消费情况的代码实例分享

    Python模拟登陆淘宝并统计淘宝消费情况的代码实例分享 支付宝十年账单上的数字有点吓人,但它统计的项目太多,只是想看看到底单纯在淘宝上支出了多少,于是写了段脚本,统计任意时间段淘宝订单的消费情况,看 ...

  4. kbmMWEncodeEscapes 中汉字编码的问题及解决办法

    kbmMWEncodeEscapes 是kbmmw 里面的一个函数,用来对URL 中的汉字进行编码,例如 http://127.0.0.1/getname?name=春节,由于'春节'是汉字,浏览器向 ...

  5. 2018.07.18 HAOI2009 逆序对数列(线性dp)

    传送门 目前只会n2" role="presentation" style="position: relative;">n2n2的dp" ...

  6. Django入门指南-第10章:Django Admin 介绍(完结)

    在浏览器中打开该URL:http://127.0.0.1:8000/admin/ 我们可以检查一切是否正常,打开URL http://127.0.0.1:8000 我们首先创建一个管理员帐户: pyt ...

  7. 编译hbase-1.2.3源代码

    目录 目录 1 1. 约定 1 2. 安装jdk 1 3. 安装maven 1 4. 网络配置 2 4.1. eclipse 3 4.2. maven 3 5. 从hbase官网下载源代码包: 4 6 ...

  8. MFC中和定时器使用

    在MFC中和定时器相关的有三个函数: 1.设置定时器(定义一个定时器的属性):         SetTimer( UINT nIDEvent, UINT nElapse, void (CALLBAC ...

  9. ubuntu18.04 编译安装 apache php

    1. apache apache 需要依赖几个模块:apr, apr-util, pcre,也分别源码安装. 1.1 编译安装 1.1.1 apr apr-util 下载地址:http://apr.a ...

  10. Spring MVC 的@RequestParam注解和request.getParameter("XXX")

    在SpringMVC后台控制层获取参数的方式主要有两种,一种是request.getParameter("name"),另外一种是用注解@RequestParam直接获取.这里主要 ...