https://cdn.bootcss.com/jQuery.Marquee/1.5.0/jquery.marquee.js

兼容vue

$("#demo4").marquee({
direction: "up",
duration: 2000, // 滚动速度 ,
pauseSpeed: 500, // 滚动完到下一条的间隔时间 ,
pauseOnHover: true, // 鼠标滑向文字时是否停止滚动 ,
loop: -1 , //设置循环滚动次数 (-1为无限循环)
});

默认配置:
 // Public: plugin defaults options
$.fn.marquee.defaults = {
// If you wish to always animate using jQuery
allowCss3Support: true,
// works when allowCss3Support is set to true - for full list see http://www.w3.org/TR/2013/WD-css3-transitions-20131119/#transition-timing-function
css3easing: 'linear',
// requires jQuery easing plugin. Default is 'linear'
easing: 'linear',
// pause time before the next animation turn in milliseconds
delayBeforeStart: 1000,
// 'left', 'right', 'up' or 'down'
direction: 'left',
// true or false - should the marquee be duplicated to show an effect of continues flow
duplicated: false,
// duration in milliseconds of the marquee in milliseconds
duration: 5000,
// gap in pixels between the tickers
gap: 20,
// on cycle pause the marquee
pauseOnCycle: false,
// on hover pause the marquee - using jQuery plugin https://github.com/tobia/Pause
pauseOnHover: false,
// the marquee is visible initially positioned next to the border towards it will be moving
startVisible: false
};

vue文字跑马灯效果的更多相关文章

  1. vue实现跑马灯效果

    vue实现跑马灯效果为阿中哥哥应援 1.效果图 2.实现代码 <!DOCTYPE html> <html lang="en"> <head> & ...

  2. Android开发:文本控件详解——TextView(二)文字跑马灯效果实现

    一.需要使用的属性: 1.android:ellipsize 作用:若文字过长,控制该控件如何显示. 对于同样的文字“Android开发:文本控件详解——TextView(二)文字跑马灯效果实现”,不 ...

  3. 黑马vue---10-11、Vue实现跑马灯效果

    黑马vue---10-11.Vue实现跑马灯效果 一.总结 一句话总结: 1. 给 [浪起来] 按钮,绑定一个点击事件   v-on   @ 2. 在按钮的事件处理函数中,写相关的业务逻辑代码:拿到 ...

  4. 用jQuery实现参数自定义的文字跑马灯效果

    一,明确需求 基本需求:最近在工作中接到一个新需求,简单来说就是实现一行文字从右到左跑马灯的效果,并且以固定的时间间隔进行循环. 原本这是一个很容易实现的需求,但是难点是要求很多参数得是用户可自行设置 ...

  5. JavaScript小实例-文字跑马灯效果

    我们常常能看到显示屏上字体的滚动以及手机弹幕等,下面所示代码就是一个简易的文字跑马灯的效果: <!DOCTYPE html> <html> <head lang=&quo ...

  6. 使用Vue做出跑马灯效果

     <div id="pmd">         <h4> {{msg}}</h4>         <input type="b ...

  7. VUE之文字跑马灯效果

    VUE之文字跑马灯效果 1.效果演示 2.相关代码 <!DOCTYPE html> <html lang="en"> <head> <me ...

  8. [转]实现文字跑马灯效果,scrolling text from right to left

    <div> <marquee direction="left" behavior="scroll" scrollamount="10 ...

  9. 实现一个微信小程序组件:文字跑马灯效果

    marquee.json { "component": true, "usingComponents": {} } marquee.wxml <!--co ...

随机推荐

  1. Modbus库开发笔记:Modbus ASCII Master开发

    这一节我们来封装Modbus ASCII Master应用,Modbus ASCII主站的开发与RTU主站的开发是一致的.同样的我们也不是做具体的应用,而是实现ASCII主站的基本功能.我们将ASCI ...

  2. SpringCloud服务提供者

    服务提供者就是提供一个服务暴露出来给别人调用,在springcloud中需要注册服务到服务中心 搭建服务提供者项目(ProduceDemo) 1.创建pom.xml <project xmlns ...

  3. BeautifulSoup的基本操作

    >>> from bs4 import BeautifulSoup   #导入 >>> soup = BeautifulSoup(url.content," ...

  4. java概念基础笔记整理

    1.构造方法没有类型,有类型的不是不叫构造方法. 2.一个类的的成员变量可以是java允许的任何数据类型,一个类可以把某个对象作为自己的一个成员变量,如果用这样的类创建对象,那么该对象中就会其他对象, ...

  5. python字符编码和文件处理

    一.了解字符编码的知识储备 1.文本编辑器存取文件的原理(nodepad++,python,word) 打开编辑器就打开了启动了一个进程,是在内存中的,所以,用编辑器编写的内容也都是存放于内存中的,断 ...

  6. CentOS6.8安装MySQL5.7.20时报Curses library not found解决

    报错如下: CMakeErroratcmake/readline.cmake:83(MESSAGE): Curseslibrarynotfound.Pleaseinstallappropriatepa ...

  7. 如何上传项目到Git

    1.首先下载Git,然后安装 我用的版本是Git-2.15.0-64-bit 2.在你的Git上创建一个新的Progect 创建完成后,会出现这样的窗口,红框圈出来的就是你的Git项目路径 3.在本地 ...

  8. 眼底血管分割训练函数(SVM,Adaboost)

    # -*- coding: utf-8 -*- import numpy as np from sklearn import svm from sklearn.model_selection impo ...

  9. 区分TCP包的顺序

    确认TCP包的顺序: 使用抓包工具抓包之后,通常按照时间先后排序的,而不是数据的内容逻辑先后.查找内容的先后的关键在于查看TCP中的Sequence number和Acknowledgment num ...

  10. SQL Server索引维护

    索引维护的两个重要方面是索引碎片和统计信息. 一:索引碎片 降低碎片的产生,当索引上的页不在具有物理连续性时,就会产生碎片,下面的情景会产生碎片: INSERT操作.UPDATE操作.DBCC SHR ...