效果图：

请关注微信公众号 何问起 , 账号ihewenqi ,或者微信扫描下图二维码：

关注后发送 愚人节 ，或 微信节日红包 ，可以体验效果。

代码如下：

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,user-scalable=no">

<title>节日来了发个HTML5红包 - 何问起</title>

<meta description="节日来了发个HTML5红包" />

<link rel="stylesheet" href="http://hovertree.com/wx/hwq/6/fake.css">

<script type="text/javascript" src="http://hovertree.com/ziyuan/jquery/jquery-1.12.1.min.js"></script>

<style type="text/css">

.body {

min-height: 100%;

}

.body::after {

background: #000 url(http://hovertree.com/wx/hwq/6/bg.jpg) no-repeat center center;

background-size: 100% auto;

}

</style>

</head>

<body>

<audio class="audio" src="http://hovertree.com/game/10/res/sounds/woosh2.MP3" preload="auto"></audio>

<audio class="audio" src="http://hovertree.com/game/10/res/sounds/woosh2.MP3" preload="auto"></audio>

<audio class="audio" src="http://hovertree.com/game/10/res/sounds/hovertreelaugh.MP3" preload="auto"></audio>

<div class="body">

<div class="crush"></div>

<dl class="main">

<dt>你有一个红包请注意查收.</dt>

<dd><img src="http://hovertree.com/wx/hwq/6/packet.png" /></dd>

</dl>

</div>

<input type="hidden" id="urltype" value="1" />

<input type="hidden" id="followurl" value="" />

<script src="http://hovertree.com/wx/hwq/6/hovertreered.js"></script>

</body>

</html>

转自：http://hovertree.com/h/bjaf/mcpnogp6.htm

HTML5题目:http://hovertree.com/tiku/bjaf/ufvyaxfv.htm

web前端汇总:http://www.cnblogs.com/jihua/p/webfront.html

节日来了发个HTML5红包的更多相关文章

  1. ThinkPHP整合微信支付之发裂变红包

    1.去商户平台里,给你的商户充钱,没钱是发不了红包哒! 2.微信红包需要证书支持,所以请大家到商户平台下去下载好证书后放到安全文件夹下,并且需要在配置文件中指定好证书路径! 好,接下来带来裂变红包具体 ...

  2. 微信小程序发红包

    背景: 近期一个朋友公司要做活动,活动放在小程序上.小程序开发倒是不难,不过要使用小程序给微信用户发红包,这个就有点麻烦 确定模式: 小程序目前没有发红包接口,要实现的话,只能是模拟红包,即小程序上做 ...

  3. HTML5本地存储

    之前对这个还不太熟悉,项目中在账号登录时,获取账号的信息,存储在本地然后随时调用//存储localStorage.setItem('data',值); //获取var information = lo ...

  4. 微信红包中使用的技术:AA收款+随机算法

    除夕夜你领到红包了吗?有的说“我领了好几K!”“我领了几W!” 土豪何其多,苦逼也不少!有的说“我出来工作了,没压岁钱了,还要发红包”.那您有去抢微信红包吗?微信群中抢“新年红包”春节爆红.618微信 ...

  5. PHP随机红包算法

    2017年1月14日 14:19:14 星期六 一, 整体设计 算法有很多种, 可以自行选择, 主要的"架构" 是这样的, 用redis decr()命令去限流, 用mysql去记 ...

  6. HTML5即将迎来黄金时代 轻应用再成行业焦点

    2015-01-23 11:03:09     来源:快鲤鱼 大众能看到的H5效果拜“微信”所赐,几乎每天都有H5页面的推广以及H5小游戏在微信上传播.其实,H5的大热与百度不无关系,2012年开始, ...

  7. 研究微信红包分配算法之Golang版

    今天来看一下红包的分配,参考几年前流传的微信红包分配算法,今天用Golang实现一版,并测试验证结果. 微信红包的随机算法是怎样实现的?https://www.zhihu.com/question/2 ...

  8. 手把手教你做个人 app

    我们都知道,开发一个app很大程度依赖服务端:服务端提供接口数据,然后我们展示:另外,开发一个app,还需要美工协助切图.没了接口,没了美工,app似乎只能做成单机版或工具类app,真的是这样的吗?先 ...

  9. jQuery+css3侧边栏导航菜单

    效果体验:http://hovertree.com/texiao/jquery/37/ 代码如下: <!doctype html> <html lang="zh" ...

随机推荐

  1. Java 教程整理：基础、项目全都有

    Java 在编程语言排行榜中一直位列前排,可知 Java 语言的受欢迎程度了. 网上有很多 Java 教程,无论是基础入门还是开发小项目的教程都比比皆是,可是系统的很少,对于Java 学习者来说找到系 ...

  2. HP服务器 hp 360g5 centos7安装问题

    HP服务器  hp 360g5 centos7安装问题 一 :启动盘无法识别硬盘 1.进入安装光盘,用上下键选择安装centos--Install Centos7(注意不可按Enter键),如图: 2 ...

  3. 解决Ubuntu Kylin 1610安装ANSYS17.2的NVIDIA显卡驱动问题

    Ubuntu Kylin 1610在安装完毕后,会自动安装显卡驱动,对于一般的图形图像使用来说自然不会有太大的问题,但是对于ANSYS17.2的一些模块,还是会出现问题.一个比较常见的问题就是Open ...

  4. Ognl表达式基本原理和使用方法

    Ognl表达式基本原理和使用方法 1.Ognl表达式语言 1.1.概述 OGNL表达式 OGNL是Object Graphic Navigation Language(对象图导航语言)的缩写,他是一个 ...

  5. Spring Security OAuth2 开发指南

    官方原文:http://projects.spring.io/spring-security-oauth/docs/oauth2.html 翻译及修改补充:Alex Liao. 转载请注明来源:htt ...

  6. logstash服务启动脚本

    logstash服务启动脚本 最近在弄ELK,发现logstash没有sysv类型的服务启动脚本,于是按照网上一个老外提供的模板自己进行修改 #添加用户 useradd logstash -M -s ...

  7. ES6 箭头函数中的 this？你可能想多了（翻译）

    箭头函数=>无疑是ES6中最受关注的一个新特性了,通过它可以简写 function 函数表达式,你也可以在各种提及箭头函数的地方看到这样的观点——“=> 就是一个新的 function”. ...

  8. 对CSS中的Position、Float属性的一些深入探讨

    对CSS中的Position.Float属性的一些深入探讨 对于Position.Float我们在平时使用上可以说是使用频率非常高的两个CSS属性,对于这两个属性的使用上面可能大多数人存在一些模糊与不 ...

  9. [异常解决] ubuntukylin16.04 LTS中关于flash安装和使用不了的问题解决

    http://www.linuxdiyf.com/linux/25211.html 归纳解决flash插件大法: 启动器中找到 软件更新,启动,点击 其它软件,把Canonical合作伙伴前方框 选上 ...

  10. C# 仿刷-框架MvcThrottle的使用

    1.介绍 1)用MvcThrottle你能保护你的网站不受攻击.刷. 2)你可以限制与设置多个不同场景允许的IP,设置 每秒/分/天 允许访问IP. 3)你可以定义限制,来处理所有请求.或者某个Con ...