您的位置:首页 - 教程 - 网页特效 - 正文
HTML5微信愚人节红包特效
在微信中查看效果方法:

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


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

效果图:


也可以在这里看效果:http://hovertree.com/wx/hwq/6/

代码如下:
<!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>你有一个微信节日红包 - 何问起</title>
<meta description="微信红包整人之愚人节快乐" />
<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/bjag/tqv7c2cw.htm
更多网页特效:http://hovertree.com/menu/texiao/

评论: