文本/链接

波浪文字动画特效的纯JS插件

阿里云


txt.wav 是一款可以实现波浪文字动画的纯 JS 插件。txt.wav 可以实现 4 种波浪文字效果:波浪效果、反弹效果、振动波效果和翻转效果。

使用方法:

在页面中引入 txt.wav.css 和 txt.wav.js 文件。

也想出现在这里?联系我们
创客主机
  1. <link rel="stylesheet" type="text/css" href="dist/css/txt.wav.css">
  2. <script src="dist/js/txt.wav.min.js"></script>

HTML 结构:

可以使用标题标签或使用[div]等容器来包裹文字,然后在容器上添加 txtwav class 类,以及需要的波浪文字效果的 class 名称。

  1. <h2>slow</h2>
  2. <div class="txtwav slow">
  3.   Lorem ipsum dolor sit amet, consectetur adipiscing elit
  4. </div>
  5.  
  6. <h2>vibe</h2>
  7. <div class="txtwav vibe">
  8.   Lorem ipsum dolor sit amet, consectetur adipiscing elit
  9. </div>
  10.  
  11. <h2>bounce</h2>
  12. <div class="txtwav bounce">
  13.   Lorem ipsum dolor sit amet, consectetur adipiscing elit
  14. </div>
  15.  
  16. <h2>flip</h2>
  17. <div class="txtwav flip">
  18.   Lorem ipsum dolor sit amet, consectetur adipiscing elit
  19. </div>

可用的波浪文字效果有:

slow:波浪效果

vibe:振动波效果

bounce:反弹效果

flip:翻转效果

txt.wav 波浪文字动画插件的 github 地址为:https://github.com/still-life-studios/txt.wav

波浪文字动画特效的纯 JS 插件

已有 400 人购买
查看演示升级 VIP立刻购买

演示地址 下载地址
收藏
(0)

发表回复

热销模板

Ashade - 作品展示摄影相册WordPress汉化主题
LensNews

本站承接 WordPress / PbootCMS / DedeCMS 等
系统建站、仿站、开发、定制等业务!