基于Html5的爱情主题网站–表白神器
介绍
一个基于基于Html5的爱情主题,文字采用打字机效果,逐字打印,并带有键盘敲击声音。在chrome,safari,firefox,IE10下都有效,chrome下效果最佳。要注意的是safari下不支持audio标签属性没有声音效果(暂未解决)。
技术要点
文字效果采用本地化字体 @font-face
动态的心型用到的是HTML5的canvas
打字机声音效果采用HTML5的audio属性
效果图:
基于Html5的爱情主题网站–表白神器的更多相关文章
- 基于Html5的爱情主题网站–表白神器(第二版)
第二版在第一版的基础上增加了一个动态3D的白云效果背景,鼠标悬浮在页面上云朵会向屏幕Z轴方向运动,在第一人称视角看来向着云朵方向前进的,由此形成一个伪3D效果.有点绕,直接看demo就能理解了.3D白 ...
- Resumable.js – 基于 HTML5 File API 的文件上传
Resumable.js 是一个 JavaScript 库,通过 HTML5 文件 API 提供,稳定和可恢复的批量上传功能.在上传大文件的时候通过每个文件分割成小块,每块在上传失败的时候,上传会不断 ...
- 快速开发基于 HTML5 网络拓扑图应用
采用 HT 开发网络拓扑图非常容易,例如<入门手册>的第一个小例子麻雀虽小五脏俱全:http://www.hightopo.com/guide/guide/core/beginners/e ...
- 程序员用HTML5制作的爱心树表白动画
体验效果:http://keleyi.com/keleyi/phtml/html5/31.htm 推荐:http://hovertree.com/texiao/css3/18/ HTML代码如下: & ...
- heX——基于 HTML5 和 Node.JS 开发桌面应用
heX 是网易有道团队的一个开源项目,允许你采用前端技术(HTML,CSS,JavaScript)开发桌面应用软件的跨平台解决方案.heX 是你开发桌面应用的一种新的选择,意在解决传统桌面应用开发中繁 ...
- 基于Heritrix的特定主题的网络爬虫配置与实现
建议在了解了一定网络爬虫的基本原理和Heritrix的架构知识后进行配置和扩展.相关博文:http://www.cnblogs.com/hustfly/p/3441747.html 摘要 随着网络时代 ...
- 一个酷炫的,基于HTML5,Jquery和Css的全屏焦点图特效,兼容各种浏览器
基于HTML5和CSS的焦点图特效,梅花图案的背景很有中国特色,而且还会动哦,效果超炫,推荐下载! 演示图 html代码 <!DOCTYPE html PUBLIC "-//W3C// ...
- 基于 HTML5 WebGL 的 3D 服务器与客户端的通信
这个例子的初衷是模拟服务器与客户端的通信,我把整个需求简化变成了今天的这个例子.3D 机房方面的模拟一般都是需要鹰眼来辅助的,这样找产品以及整个空间的概括会比较明确,在这个例子中我也加了,这篇文章就算 ...
- 基于 HTML5 WebGL 的 3D SCADA 主站系统
这个例子的初衷是模拟服务器与客户端的通信,我把整个需求简化变成了今天的这个例子.3D 的模拟一般需要鹰眼来辅助的,这样找产品以及整个空间的概括会比较明确,在这个例子中我也加了,这篇文章就算是我对这次项 ...
随机推荐
- jdk eclipse SDK下载安装及配置教程
原文地址https://blog.csdn.net/dr_neo/article/details/49870587 最新鲜最详细的Android SDK下载安装及配置教程 最近Neo突发神经,想要将学 ...
- 解决不能在本地使用JQuery load的方法
$.ajaxSetup({ xhr: function () { if ("ActiveXObject" in window) { return new ActiveXObject ...
- 哈尔滨理工大学软件与微电子学院第八届程序设计竞赛同步赛(高年级) Solution
A: Solved. 分别处理出每个%7后余数的数字个数,再组合一下 #include <bits/stdc++.h> using namespace std; #define ll lo ...
- android,结合Timer和TimerTask实现定时任务
当我们需要每隔一段时间执行一个任务的时候,就需要使用TimerTask了,下面是入门的例子, 值得注意的是Timer.TimerTask,cancel之后就需要重新声明一个对象,否则会报错的哦~ pa ...
- 20155203 2016-2017-4 《Java程序设计》第8周学习总结
20155203 2016-2017-4 <Java程序设计>第8周学习总结 教材学习内容总结 1.channel的继承架构 2.position()类似于堆栈操作中的栈顶指针. 3.Pa ...
- Entity Framework Code First级联删除(转)
使用Data Annotations: 如果我们要到一对主从表增加级联删除,则要在主表中的引用属性上增加Required关键字,如: public class Destination { public ...
- C#——文件上传(一般处理程序ashx)
Framework版本:.Net Framework 4 1.FileInfo实体 using System; using System.Collections.Generic; using Syst ...
- bzoj1601 / P1550 [USACO08OCT]打井Watering Hole(堆优化prim)
P1550 [USACO08OCT]打井Watering Hole 对于自己建水库的情况,新建一个虚拟结点,和其他点的边权即为自建水库的费用 这样问题就转化为一个裸最小生成树问题了. 这里用堆优化 ...
- 20145325张梓靖 《Java程序设计》第2周学习总结
20145325张梓靖 <Java程序设计>第2周学习总结 教材学习内容总结 整数 short 2字节,int 4字节,long 8字节 字节 byte 1字节 浮点数 float 4字节 ...
- Linux 下源码编译安装 vim 8.1
前言 目前 linux 的各个发行版基本上都是带了一个 vi 编辑器的,而本文要说的 vim 编辑器对 vi 做了一些优化升级,更好用.当我们需要远程操作一台 linux 服务器的时候,只能使用命令行 ...