HTML5火焰文字特效DEMO演示
效果展示:http://hovertree.com/texiao/html5/26/
效果图:
扫描二维码查看效果:
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAIAAABMXPacAAAEG0lEQVR4nO2dwXLDMAhE407//5fTm9sZEbwsqOu0+06d2Jbc7IABIed4Pp8Po+NDfQP/HQsg5vP86ziO/nCnQ6uOlnvCcDRwrupp4bz0/3U5ly1AjAUQ87l+VI2LcKtMRiZMm3ApyGkj/05IOLItQIwFEBO4oJNNNh6ODJ5G3MkayeQjE5lp54uyBYixAGIsgJjsGdChmjoSYWg1eQ6nGHnOdbAFiLEAYna5oJBO2okMQniM1VWG0eo+X2QLEGMBxGQuqGN3nfwTrMLn/iH3Lcj5OJ0vyhYgxgKICVzQyKpbzuwK38nP0aoVuqrPvDwKYgsQYwHEWAAxx6YcD2wk6ax+dNw3mE47E/77WAAxmQsiOs5oJ4MPQgd/I4k9ODJ+vi1AjAUQEzTngrWt9VAImJ3mTiYfpJORVjtf8GQbPM0WIMYCiLEAYoIwNH8YdAIyMEilGxd/oYtkfDOILUCMBRCTbdDIC2oh4ApGZ3vXb+6rpfN53HvbAsRYADFHtXxGu5HwTLCidzkyMsjIBg1wCkdBb4MFEIM259ILgeMBDD3IeErY8TwntgAxFkCMBRDz/QygE2AiYc6vzQepZqegg57dyxY+KsI7twWIsQBi0GJcYvi4o1g/7JT2VvbtESOuBbEFiLEAYgbaUvAXuo3YbD5vcieda6vOED/fFiDGAoixAGKCBZmQTW/yI1Z9qwtH+bw5YK2082yzBYixAGL4PWLjPWLryJ3V6WptkTiNDlJdjLsRFkBM9qqCzjJpeLQ6VzLs5SVVRhLmkHwQW4AYCyCG74ybZTYcury22hk3W7xzFHQjLIAYCyCmXIyb3UF2cXPFWhjB7HtbCGwBYiyAGHSbKp0TdnY0VFNx/I0GI3W0Ku6MuyMWQEzWlgLaLNEZtzLS1BYCxipEoDVSO7AFiLEAYiyAGDQTBhlp9wBPm12UBh9a1f6UfNKHLUCOBRCD/oIGvYIBbqzFs27wTmZ7W8LZ120mxNKQLUCMBRCDrgnTRSt8+8Z6tMpIuS1k3142W4AYCyCG/0Xtk3xX+KszX31yeSfVPhoivAFvrxrUOQq6IxZAjAUQMxyGbtp7RTBSqqtChNe2ADEWQMz23xEDy+vE+w6SYfEpQEa2mYTYAsRYADFBW0qHpERODEIklvQgoM8EnSG+rmkLEGMBxFgAMdlL+0DwFozEfROd2NUdy6/OvBwWvPDV0fwSW4AYCyCGX5AZeblAJ4dcI8h83aazVaQaTLsz7m2wAGLQX9CgASMTotw2u9Esv+GRTSshtgAxFkDMdhdExB4j9f08vqLjMaKil09hCxBjAcRYADHlN2YFQ6QRJHNPxTuZ7SrEob8oPwNuhAUQk703dASiotfxPMnRfXtdOw7NFiDGAojZ1RlnQGwBYiyAGAsg5gtXtrIfJZ2UkwAAAABJRU5ErkJggg==" alt="火焰二维码" width="128" height="128" />
或者关注微信公众号 ihewenqi ,发送 我 或者 张国荣 ,可以查看效果。
代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML5火焰文字特效DEMO演示 - 何问起</title>
<style>
html, body {
margin: 0px;
width: 100%;
height: 100%;
overflow: hidden;
background-color: #000000;
font-family: sans-serif;
} #canvasContainer {
margin: 0px;
width: 100%;
height: 100%;
}
</style>
</head> <body>
<div>
</div>
<div id="canvasContainer"></div>
<!--修改这里的文字-->
<span id="hovrtreefire">何问起</span> <a href="http://hovertree.com/">首页</a>
<a href="http://hovertree.com/texiao/">特效</a>
<a href="http://hovertree.com/h/bjaf/xmrvjvng.htm">原文</a> <script src="http://hovertree.com/texiao/html5/26/hovertreefire.js"></script>
</body>
</html>
转自:http://hovertree.com/h/bjaf/xmrvjvng.htm
更多特效:http://www.cnblogs.com/roucheng/p/texiao.html
HTML5火焰文字特效DEMO演示的更多相关文章
- HTML5火焰文字特效DEMO演示---转载
只有google支持 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> &l ...
- CSS3火焰文字特效制作教程
原文:CSS3火焰文字特效制作教程 用一句很俗气的话概括这两天的情况就是:“最近很忙”,虽然手头上有不少很酷的HTML5和CSS3资源,但确实没时间将它们的实现过程写成教程分享给大家.今天刚完成了一个 ...
- HTML5 3D 粒子波浪动画特效DEMO演示
需要thress.js插件: http://github.com/mrdoob/three.js // three.js - http://github.com/mrdoob/three.js ...
- 7款震撼人心的HTML5文字特效
1.CSS3五彩文字特效 文字带阴影效果 这是一款非常具有卡通形象的CSS3五彩文字特效,虽然没有迷人的动画效果,但是五彩缤纷的文字展现在屏幕上也是非常酷的,再加上每一个文字都有不同角度的阴影效果,加 ...
- 7款让人惊叹的HTML5粒子动画特效(转载)
1.HTML5 Canvas粒子模拟效果 这是一款利用HTML5 Canvas模拟出来的30000个粒子动画,当你用鼠标在canvas画布上移动时,鼠标周围的一些粒子就会跟着你移动,并形成一定的图案, ...
- 7款让人惊叹的HTML5粒子动画特效
HTML5的很大一个优势就是可以更加便捷高效地制作网页粒子动画特效,特别是Canvas特性,可以实现在网页上绘制任何图形和动画.本文要分享7款让人惊叹的HTML5粒子动画特效,这些粒子特效都提供源代码 ...
- 16个富有创意的HTML5 Canvas动画特效集合
HTML5技术正在不断的发展和更新,越来越多的开发者也正在加入HTML5阵营,甚至在移动开发上HTML5的地位也是越来越重要了.HTML5中的大部分动画都是通过Canvas实现,因为Canvas就像一 ...
- 16个非常有趣的HTML5 Canvas动画特效集合
HTML5技术正在不断的发展和更新,越来越多的开发者也正在加入HTML5阵营,甚至在移动开发上HTML5的地位也是越来越重要了.HTML5中的大部分动画都是通过Canvas实现,因为Canvas就像一 ...
- 9种jQuery和css3图片动画特效代码演示
1.自由旋转的jQuery图片 演示和下载地址 2.css3阴影动画效果 演示和下载地址 3.拉窗帘特效图片 演示和下载地址 4.css3文字特效动画 演示和下载地址 5.css3时钟代码 演示和下载 ...
随机推荐
- Unity依赖注入使用详解
写在前面 构造器注入 Dependency属性注入 InjectionMethod方法注入 非泛型注入 标识键 ContainerControlledLifetimeManager单例 Unity注册 ...
- 玩转JavaScript OOP[2]——类的实现
概述 当我们在谈论面向对象编程时,我们在谈论什么?我们首先谈论的是一些概念:对象.类.封装.继承.多态.对象和类是面向对象的基础,封装.继承和多态是面向对象编程的三大特性. JavaScript提供了 ...
- TODO:Node.js pm2使用方法
TODO:Node.js pm2使用方法 pm2 是一个带有负载均衡功能的Node应用的进程管理器. 当你要把你的独立代码利用全部的服务器上的所有CPU,并保证进程永远都活着,0秒的重载, PM2是完 ...
- Java 8函数编程轻松入门
函数接口介绍 在Java1.8中,新增了Lambda表达式.在.net3.5(C# 3.0)在原先的匿名方法基础上演变出了Lambda表达式.学过C# Lambda表达式的同学,对于Java的Lamb ...
- How to use the function of assembly.
Here are some simple conceptions that I summarized: 1, %rsp ----- top of the stack 2, %rbp -- ...
- 使用Hexo搭建专属Blog
喜欢折腾的自己最开始在博客园有仿写几篇Blog,虽也可以自己改变风格,可是到底不是独立的一块儿地方,要知道独立的才是自己的;有属于自己独立的域名和Blog,真真是一件很爽的存在.在各种大牛的分享下在G ...
- 简单了解JS 中的indexOf方法
indexOf() 方法返回指定值在字符串对象中首次出现的位置.从 fromIndex 位置开始查找,如果不存在,则返回 -1. 首先先看下MDN下的参考文档,文档里列出的很详细,这里我只列出了注意点 ...
- IOS关于LKDBHelper实体对象映射插件运用
一 插件简介: 其github地址:https://github.com/li6185377/LKDBHelper-SQLite-ORM 全面支持 NSArray,NSDictionary, Mode ...
- 王宝强新片P2P风波持续发酵,互金真的前途未卜?
王宝强离婚风波还未完全结束,一波未平一波又起,新片又引来话题爆点,其自导自演的电影<大闹天竺>陷P2P平台集资的新闻占据各大媒体头条. 该P2P平台为湖北武汉一家P2P互联网金融理财平台& ...
- 考勤系统代码分析——主页布局easyui框架
考勤系统主页的布局用的是easyui的Layout控件 Layout:布局容器有5个区域:北.南.东.西和中间.中间区域面板是必须的,边缘的面板都是可选的.每个边缘区域面板都可以通过拖拽其边框改变大小 ...