效果图：

请关注微信公众号 何问起 , 账号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. Centos 6.6 下搭建php5.2.17+Zend Optimizer3.3.9+Jexus环境

    (为何安装php5.2.17这个版本 因为phpweb这个程序用到了Zend Optimizer3.3.9 这个东东已经停止更新了 最高支持5.2版本的php 所以就有了一晚上填坑的自己和总结了这篇文 ...

  2. 在 Linux 中使用搜狗拼音输入法以及搞定 Flash 和支付宝

    在 Ubuntu 中安装搜狗输入法 在 Ubuntu Kylin 系统中,默认安装搜狗拼音输入法,但是在原生 Ubuntu 系统中则不是.这可以理解,毕竟搜狗输入法的 Linux 版有 Kylin 团 ...

  3. 遍历dynamic的方式

    一.遍历ExpandoObject /// <summary> /// 遍历ExpandoObject /// </summary> [TestMethod] public v ...

  4. MSSQLSERVER执行计划详解

    序言 本篇主要目的有二: 1.看懂t-sql的执行计划,明白执行计划中的一些常识. 2.能够分析执行计划,找到优化sql性能的思路或方案. 如果你对sql查询优化的理解或常识不是很深入,那么推荐几骗博 ...

  5. awk命令简介

    awk是一个强大的文本分析工具,相对于grep的查找,sed的编辑,awk在其对数据分析并生成报告时,显得尤为强大.简单来说awk就是把文件逐行的读入,以空格为默认分隔符将每行切片,切开的部分再进行各 ...

  6. [C#] 走进异步编程的世界 - 剖析异步方法（上）

    走进异步编程的世界 - 剖析异步方法(上) 序 这是上篇<走进异步编程的世界 - 开始接触 async/await 异步编程>(入门)的第二章内容,主要是与大家共同深入探讨下异步方法. 本 ...

  7. 计算机程序的思维逻辑 (46) - 剖析PriorityQueue

    上节介绍了堆的基本概念和算法,本节我们来探讨堆在Java中的具体实现类 - PriorityQueue. 我们先从基本概念谈起,然后介绍其用法,接着分析实现代码,最后总结分析其特点. 基本概念 顾名思 ...

  8. c# 检测操作系统版本

    我们通过System.Environment.OSVersion.Version获得操作系统的版本号,然后再根据版本号进行判断操作系统是什么版本 Version 类的属性 Operating syst ...

  9. Android popupwindow使用心得（一）

    最近项目中好多地方用到popupwindow,感觉这个控件还是非常重要的.所以把使用心得总结下,废话不多说,直接上代码. public class MainActivity extends Activ ...

  10. Android官方文档

    下面的内容来自Android官方网站,由于访问这个网站需要FQ,不方便,所以我把部分内容copy下来了,不保证内容是最新的. Source Overview    Codelines, Branche ...