vue的无缝滚动插件vue-seamless-scroll的安装与使用
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的安装与使用的更多相关文章
- vue的无缝滚动插件vue-seamless-scroll的使用
https://chenxuan0000.github.io/component-document/index_prod.html#/component/seamless-others 在vue环境下 ...
- 基于vue的无缝滚动组件
vue-seamless-scroll A simple, Seamless scrolling for Vue.js 在awesome上一直没有发现vue的无缝滚动组件,在工作之余写了个组件,分享出 ...
- vue实现无缝滚动
vue实现无缝滚动 标签部分 <div style="height: 260px; width: 50%;display: inline-block;float: right; ove ...
- 手写JS无缝滚动插件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- liMarquee – jQuery无缝滚动插件(制作跑马灯效果)
liMarquee 是一款基于 jQuery 的无缝滚动插件,类似于 HTML 的 marquee 标签,但比 marquee 更强大.它可以应用于任何 Web 元素,包括文字.图像.表格.表单等元素 ...
- 利用jQuery无缝滚动插件liMarquee实现图片(链接)和文字(链接)向右无缝滚动(兼容ie7+)
像新闻类的版块经常要求一条条的新闻滚动出现,要实现这种效果,可以使用jQuery无缝滚动插件liMarquee. 注意: 1. 它的兼容性是IE7+,及现代浏览器. 2. 引用的jquery的版本最好 ...
- vue插件 vue-seamless-scroll 无缝滚动插件ES6使用总结
最近因为需求需要写一个项目信息无缝向上滚动组件,在网上搜了一下,看到大家的一致好评就果断的使用了vue-seamless-scroll组件.下面就简单的介绍它的使用,具体详细的使用推荐大家去看下开发者 ...
- Vue 消息无缝滚动
vue实现消息向上无缝滚动效果 <ul class="new-list" :class="{anim:animate}" @mouseenter=&quo ...
- 一款经典的jQuery kxbdMarquee 无缝滚动插件
<marquee> 曾是 IE 下独有的一个走马灯效果的标签,其他浏览器并不兼容,于是出现了使用 JavaScript 来模拟该效果的插件. 版本: jQuery v1.3.2+ 在线实例 ...
随机推荐
- struts2 的 ServletActionContext 和 actionContext,服务器代码测试, redirect 、dispatcher、chain、redirectAction
一.ServletActionContext 和 actionContext HttpServletRequest request=ServletActionContext.getRequest() ...
- hadoop 学习(三)之hdfs shell命令
1.HDFS shell 1.0查看帮助 hadoop fs -help <cmd> 1.1上传 hadoop fs -put <linux上文件> <hdfs上的路 ...
- Angular 通过注入 $location 获取与修改当前页面URL
//1.获取当前完整的url路径 var absurl = $location.absUrl(); //http://172.16.0.88:8100/#/homePage?id=10&a=1 ...
- css页面组件
页面组件 1 元素的尺寸/边框/背景 1.1 css尺寸相关属性 height 高度 min-height 最小高度 max-height 最大高度 width 宽度 min-width 最小宽度 m ...
- python之数据类型1
什么是数据类型及数据类型分类 python中的数据类型 python使用对象模型来存储数据,每一个数据类型都有一个内置的类,每新建一个数据,实际就是在初始化生成一个对象,即所有数据都是对 ...
- 2018.08.29 NOIP模拟 pmatrix(线性筛)
[问题描述] 根据哥德巴赫猜想(每个不小于 6 的偶数都可以表示为两个奇素数之和),定义 哥德巴赫矩阵 A 如下:对于正整数对(i,j),若 i+j 为偶数且 i,j 均为奇素数,则 Ai,j = 1 ...
- 23. Man and His Natural Habitat 人类及其自然栖息地
. Man and His Natural Habitat 人类及其自然栖息地 ① Ecology is that branch of science which concerns itself wi ...
- 大文件webuploader的基本使用
webuploader的简单使用 需要的文件 自备 百度很多 webuploader.js uploader.swf jQuery <!DOCTYPE html> <htm ...
- nexus 组件下载和上传
一. 重写 super pom 修改 maven 的 settings.xml Configuring Maven to Use a Single Repository Group <setti ...
- tensorflow1.12 cuda10 cudnn7
https://download.csdn.net/download/giselite/10909984 https://blog.csdn.net/chary8088/article/details ...