textillate.js是一款强大的文字插件,若配合animate.css、fittext、lettering一起使用,这样做出来的文字特效很完美。

在线实例

实例演示

使用方法

  1. <div id="texts">Welcome To shouce</div>
复制
  1. $(function() {
  2. $('#texts').fitText(3.2, {maxFontSize: 18}).textillate({initialDelay: 1000, in: {delay: 3, shuffle: true}});
  3. })
复制

参数详解

参数 描述 默认值
selector 目标选择器 .texts
loop 是否循环 false
minDisplayTime 最小间隔时间 2000
initialDelay 初始化间隔时间 0
in {       effect: 'fadeInLeftBig',       delayScale: 1.5,       delay: 50,       sync: false,       reverse: false,       shuffle: false,       callback: function () {}     } -
out {       effect: 'hinge',       delayScale: 1.5,       delay: 50,       sync: false,       reverse: false,       shuffle: false,       callback: function () {}     } -
autoStart 自动开始 true
callback 回调函数 function () {} -

textillate.js 文字动画的更多相关文章

  1. Textillate.js有什么用及使用实例

    Textillate.js有什么用及使用实例 一.总结 一句话总结:Textillate.js – 实现动感的 CSS3 文本动画的简单插件 二.textillate.js 文字动画 textilla ...

  2. jquery使用CSS3实现文字动画效果插件Textillate.js

    Textillate是一款基于jquery的使用CSS3实现文字动画的小巧插件.Textillate.js集成了一些很棒的使用CSS3动画效果的 JavaScript 库,您可非常轻轻松地把这些动画效 ...

  3. JS框架_(Typed.js)彩色霓虹灯发光文字动画

    百度云盘 传送门 密码:8oei 发光文字动画效果: <!doctype html> <html> <head> <meta charset="ut ...

  4. JS - 超强大文本动画插件Textillate.js

    http://www.yyyweb.com/demo/textillate/ Textillate.js AsimplepluginforCSS3textanimations.

  5. 使用veloticy-ui生成文字动画

    前言 最近要实现一个类似文字波浪线的效果,使用了velocity-ui这个动画库,第一个感觉就是使用简单,代码量少,性能优异,在此简单介绍一下使用方法,并实现一个看上去不错的动画.具体使用方法可以点击 ...

  6. 用js实现动画效果核心方式

    为了做好导航菜单,有时候需要在菜单下拉的时候实现动画效果,所以这几天就研究了研究如何用js实现动画效果,实现动画核心要用到两个函数,一个是setTimeOut,另一个是setInterval. 下边我 ...

  7. js双层动画幻灯

    js双层动画幻灯 点击下载

  8. 分享十个CSS3鼠标滑过文字动画特效

    介绍10组基于CSS3的鼠标滑过文字动画特效,有上凸.下凹等文字动画.这些炫酷的CSS3文字效果可以让网页变得更加绚丽.效果图如下: 在线预览   源码下载 实现的代码. html代码: <h2 ...

  9. 仿知乎/途家导航栏渐变文字动画效果-b

    demo.gif 效果图如上,简单分析下 1.导航栏一开始是隐藏的,随着scrollView滚动而渐变 2.导航栏左右两边的navigationItem是一直显示的 3.导航栏参考了途家app,使用了 ...

随机推荐

  1. setTimeout,clearTimeout和setInterval

    http://www.cnblogs.com/backuper/archive/2009/12/02/1615129.html var timeout; timeout = setTimeout(hi ...

  2. Mina、Netty、Twisted一起学(七):发布/订阅(Publish/Subscribe)

    消息传递有很多种方式,请求/响应(Request/Reply)是最常用的.在前面的博文的例子中,很多都是采用请求/响应的方式,当服务器接收到消息后,会立即write回写一条消息到客户端.HTTP协议也 ...

  3. JavaWeb:实现文件上传

    JavaWeb:实现文件上传 理解文件上传: 1.上传文件就是把客户端的文件发送给服务器端. 2.HTTP响应的正文部分最常见的是HTML文档,但是也可以是其他任意格式的数据,如图片和声音文件中的数据 ...

  4. 利用Dapper ORM搭建三层架构

    利用Dapper关系对象映射器写的简单的三层架构.Dapper:StackOverFlow在使用的一个微型的ORM,框架整体效率较高,轻量级的ORM框架.网上有较多的扩展.此处只是简单的调用Dappe ...

  5. Oracle数据库常见的误操作恢复方法(上)

    实验环境:Linux6.4 + Oracle 11g 面向读者:Oracle开发维护人员 概要: 1.误操作drop了emp表 2.误操作delete了emp表 3.误操作delete了emp表的部分 ...

  6. Windows Azure Service Bus (4) Service Bus Queue和Storage Queue的区别

    <Windows Azure Platform 系列文章目录> 熟悉笔者文章的读者都了解,Azure提供两种不同方式的Queue消息队列: 1.Azure Storage Queue 具体 ...

  7. Laravel5设计json api时候的一些道道

    对于返回数据格式没规整的问题 在开发api的时候,这个问题是和客户端交涉最多的问题,比如一个user结构,返回的字段原本是个user_name的,它应该是string类型.但是呢,由于数据库设计这个字 ...

  8. 用Visual Studio Code 开发应用之 安装 Visual Studio Code

    最近研究微软的ASP.NET 新一代产品 ASP.NET Core1.0. 发先Visual Studio Code是一个很好的很强大的开源编辑器.是编辑器而不是IDE.之所以强大是因为他可以说是一个 ...

  9. C语言学习006:歌曲搜索

    #include <stdio.h> #include <string.h> //字符串处理库 ]={ "I left my heart in Harvard Med ...

  10. ASP.NET MVC的TextBoxFor()和TextBox()

    先来看看2者的语法:TextBoxFor():MvcHtmlString Html.TextBoxFor(Expression<Func<TModel,TValue>> exp ...