效果圖：
請關注微信公眾號 何問起 , 賬號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