textillate.js 文字动画

最新推荐文章于 2024-08-22 08:53:34 发布

最新推荐文章于 2024-08-22 08:53:34 发布 · 236 阅读

文章标签：

116 篇文章

订阅专栏

本文介绍 textillate.js 这款强大的文字插件，并演示如何与 animate.css、fittext 和 lettering 结合使用，创建出令人印象深刻的网页文字特效。文中提供了一个实例，展示了如何设置文字动画及调整各种参数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

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

复制

$(function() {
$('#texts').fitText(3.2, {maxFontSize: 18}).textillate({initialDelay: 1000, in: {delay: 3, shuffle: true}});
})

复制

参数	描述	默认值
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 () {}	-