js+css实现文字散开重组动画特效代码分享
2015-08-21 00:00
1136 查看
文字散开重组动画这款特效我们可以在输入框中指定任意文字,点击确定按钮后,就会将原先的文字爆炸散去,新的文字以像素点的形式组合起来,看起来非常棒。
运行效果图:
这是输入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="脚本之家" /> <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实现文字散开重组动画特效代码,希望大家可以喜欢。
相关文章推荐
- JavaScript 常见安全漏洞和自动化检测技术
- Javascript仿新浪游戏频道鼠标悬停显示子菜单效果
- js实现点击切换TAB标签实例
- SeaJS之use函数
- js处理浮点运算精度不正确的问题
- js 中 ownerDocument与documentElement的区别
- 测试javascript继承
- js获取图片高度是 要注意图片是否已经加载完毕
- Jsoup Post 登陆搜外论坛并获取Cookies 2015-08-21
- javascript开发与调试方法
- js: 实现Select的option上下移动
- javascript中event.keycode大全
- jsp:include标签
- JavaScript运算符
- js图片延迟加载
- 怎么在div中创建子元素,删除子元素,删除所有的子元素
- 奔跑吧,我的JavaScript(1)
- JavaScript--点击按钮实现选中选项移动到指定位置(下拉框)或全部选项移动
- json、js数组真心不是想得那么简单
- JavaScript--点击按钮实现复选框全选和反选功能