GSAP<splitText文字分割插件>

589 阅读1分钟

gif1.gif

CDN引入

splitText插件属于GSAP的会员插件,你可以选择官方CDN引入,也可以先用这里的

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.3/gsap.min.js"></script>
<script src="https://www.micelistudios.com/js/utils/SplitText.min.js"></script>

在线代码

参数介绍

官方文档地址(英文)

持续更新~

参数类型说明
typeString分隔类型的逗号分隔列表,可以是以下任何一种:字符、单词或行。这表明您希望将组件的类型拆分为不同的 < div >元素。例如,要分割字符和单词(而不是行),您可以使用type: "chars,words",或者只分割行,您可以使用type: "lines"。为了避免奇数换行,最好不要单独按字符进行分隔(如果要按字符进行分隔,也要包括单词或行)。注意:空格不被认为是字符。默认值:“识字课,话说,行”。
.chartsArray一个数组,它包含被分离的所有角色的原始DOM元素。
staggerNumber,Function在同时处理多个数据时的,递增或者递减配置