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. Vue2.0+ElementUI+PageHelper实现的表格分页

    Vue2.0+ElementUI+PageHelper实现的表格分页 前言 最近做了一些前端的项目,要对表格进行一些分页显示.表格分页的方法有很多,从宏观上来说分为物理分页和逻辑分页,由于逻辑分页(即 ...

  2. 【Maven】安装及配置(Linux)

    本文介绍Linux环境下安装Maven 安装环境和软件 系统:Linux(CentOS) 软件:apache-maven-3.3.9-bin.tar.gz(解压版). 安装步骤 maven是基于Jav ...

  3. PTA第一次作业和第二次作业

    PTA的第一次作业第一题: #include <stdio.h> int main (void) { int grade,i,N ,a=0,b=0,c=0,d=0,e=0; printf( ...

  4. kafka系列 -- 基础概念

    kafka是一个分布式的.分区化.可复制提交的发布订阅消息系统 传统的消息传递方法包括两种: 排队:在队列中,一组用户可以从服务器中读取消息,每条消息都发送给其中一个人. 发布-订阅:在这个模型中,消 ...

  5. DataFrame按行读取:DataFrame之values

    http://blog.csdn.net/u014607457/article/details/51290582 def fill_core(self): RatingTable=pd.read_cs ...

  6. qq强制聊天工具

    当你想和别人聊天, 别人有不理你的时候可以用上哦!!!特别是情人吵架的时候, 呵呵 复制下面的代码: @echo off title DIY-QQ强制聊天工具color 0a echo. echo.  ...

  7. MEF程序设计指南

    ############################################################################################## ##### ...

  8. HBase Thrift2 CPU过高问题分析

    目录 目录 1 1. 现象描述 1 2. 问题定位 2 3. 解决方案 5 4. 相关代码 5 1. 现象描述 外界连接9090端口均超时,但telnet端口总是成功.使用top命令观察,发现单个线程 ...

  9. Java 容器 LinkedHashMap源码分析2

    一.类签名 LinkedHashMap<K,V>继承自HashMap<K,V>,可知存入的节点key永远是唯一的.可以通过Android的LruCache了解LinkedHas ...

  10. DagScheduler 和 TaskScheduler

    DagScheduler 和 TaskScheduler 的任务交接 spark 调度器分为两个部分, 一个是 DagScheduler, 一个是 TaskScheduler, DagSchedule ...