效果图:
请关注微信公众号 何问起 , 账号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