textillate.js 介绍
Textillate是一款基于jquery的使用css3实现文字动画的小巧插件。Textillate.js集成了一些很棒的使用css3动画效果的 JavaScript 库，您可非常轻轻松地把这些动画效果应该于网页中的任何文字。
textillate.js使用
引入核心文件
<link href="assets/animate.css" rel="stylesheet">
<script src="http://libs.useso.com/js/jquery/1.9.0/jquery.min.js"></script>
<script src="assets/jquery.lettering.js"></script>
构建html标签
<h1 class="tlt">My Title</h1>
写入js，初始化
$(function () {
$('.tlt').textillate();
})
以上代码使用了默认的动画效果，如果你想改变动理效果，可以在html中调用data API
<h1 class="tlt" data-in-effect="rollIn">Title</h1>
你也可以在初始化时使用参数来改变
$('.tlt').textillate({ in: { effect: 'rollIn' } });
当然，你也可以用Textillate给一个列表的文字都具有动画
<h1 class="tlt">
<ul class="texts">
<li data-out-effect="fadeOut" data-out-shuffle="true">Some Title</li>
<li data-in-effect="fadeIn">Another Title</li>
</ul>
</h1>
$('.tlt').textillate();
注意：你可以通过调用data api配置动画参数来控制每个li的动画效果。
GitHub:https://github.com/jschr/textillate
网站描述: 实现动感的 CSS3 文本动画的简单插件
textillate.js
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。