AutoCAD 3DMAX C语言 Pro/E UG JAVA编程 PHP编程 Maya动画 Matlab应用 Android
Photoshop Word Excel flash VB编程 VC编程 Coreldraw SolidWorks A Designer Unity3D
 首页 > JavaScript

js+css实现文字散开重组动画特效代码分享

51自学网 http://www.wanshiok.com
js,css,文字散开重组,文字动画特效

文字散开重组动画这款特效我们可以在输入框中指定任意文字,点击确定按钮后,就会将原先的文字爆炸散去,新的文字以像素点的形式组合起来,看起来非常棒。

运行效果图:

这是输入HAPPY后安按钮后效果,当然可以随便输文字

好酷的特效,连中文都支持,看如下图:

为大家分享的文字散开重组动画特效代码如下

<html><head><meta charset="UTF-8"><title>文字散开重组动画特效</title><link rel="stylesheet" href="css/style.css" media="screen" type="text/css" /></head><body><canvas id="text" width="500" height="100"></canvas><canvas id="stage" width="500" height="100"></canvas><form id="form">  <input type="text" id="inputText" value="wanshiok.com" />  <input type="submit" value="TRY IT" /></form><script src='js/EasePack.min.js'></script><script src='js/TweenLite.min.js'></script><script src='js/easeljs-0.7.1.min.js'></script><script src='js/requestAnimationFrame.js'></script><script src="js/index.js"></script></body></html>

以上就是为大家分享的js+css实现文字散开重组动画特效代码,希望大家可以喜欢。


js,css,文字散开重组,文字动画特效  
上一篇:JavaScript 常见安全漏洞和自动化检测技术  下一篇:jquery实现叠层3D文字特效代码分享