Fork me on GitHub

qq电脑管家抽奖页面源代码


桌面qq电脑管家中个人中心的抽奖页面竟然是HTML写的，光大我HTML。！！！
  1. <!DOCTYPE html>
  2. <html>
  3. <head lang="en">
  4.     <meta charset="UTF-8">
  5.     <title></title>
  6.     <link rel="stylesheet" href="../css/lottery.css"/>
  7. </head>
  8. <body>
  9. <div class="wrap">
  10.     <a class="close" href="javascript:window.parent.swingOff();"></a>
  11. 	<div class="lottery_title">
  12.         <div class="icon"></div>
  13.         <p class="p1">来抽奖，拼手气！</p>
  14.         <a href="#" class="return" onclick="goLottery();return false;" style="margin-top: 10px; display: none;">返回上一页</a>
  15.         <p class="p2">今天还有 <span id="lottery_num" class="green">0</span> 次抽奖机会哦~ </p>
  16.     </div>
  17.     <div class="page">
  18.         <div class="lotter-wrap">
  20.             <div id="lottery">
  21.                 <table>
  22.                     <tr>
  23.                         <td class="lottery-unit lottery-unit-0"><div class="lottrymask"></div><img  /><p>5安全金币</p></td>
  24.                         <td class="lottery-unit lottery-unit-1"><div class="lottrymask"></div><img  /><p>传奇霸业</p></td>
  25.                         <td class="lottery-unit lottery-unit-2"><div class="lottrymask"></div><img  /><p>金秀贤西装抱枕</p></td>
  26.                         <td class="lottery-unit lottery-unit-3"><div class="lottrymask"></div><img  /><p>Mac air</p></td>
  27.                     </tr>
  28.                     <tr>
  29.                         <td class="lottery-unit lottery-unit-9"><div class="lottrymask"></div><img  /><p>新版管家公仔</p></td>
  30.                         <td colspan="2">
  31.                             <div id="lotterybtn" title="点击按钮赢大奖！">
  32.                                 <i>立即抽奖</i>
  33.                                 <p>还有 <span class="num">0</span> 次抽奖机会</p>
  34.                             </div>
  35.                         </td>
  36.                         <td class="lottery-unit lottery-unit-4"><div class="lottrymask"></div><img /><p>财神公仔</p></td>
  37.                     </tr>
  38.                     <tr>
  39.                         <td class="lottery-unit lottery-unit-8"><div class="lottrymask"></div><img /><p>iWatch</p></td>
  40.                         <td class="lottery-unit lottery-unit-7"><div class="lottrymask"></div><img /><p>10Q币</p></td>
  41.                         <!--<td class="lottery-unit lottery-unit-7"><div class="lottrymask"></div><img src="../images/lottery/jb.png" /><p>5安全金币</p></td>-->
  42.                         <td class="lottery-unit lottery-unit-6"><div class="lottrymask"></div><img /><p>谢谢参与</p></td>
  43.                         <td class="lottery-unit lottery-unit-5"><div class="lottrymask"></div><img  /><p>机器人微宝</p></td>
  44.                     </tr>
  45.                 </table>
  46.             </div>
  47. 			
  48.             <div class="lottery-bottom">
  49.                 <div class="lottery-sidebar" style="float:left; padding-left:25px;">
  50.                     <div class="title">
  51.                         <b>抽奖条件：</b>满足任一条件即可抽奖 1次 <a data-stats="lottery.more_info" href="http://bbs.guanjia.qq.com/forum.php?mod=viewthread&tid=3434629" target="_blank" style="position: absolute; right: 0;">详情</a>
  52.                     </div>
  53.                     <ul class="condition">
  54.                     </ul>
  55.                 </div>
  56.                 <div class="lottery-sidebar" style="float:right; padding-right:25px;">
  57.                     <div class="title">
  58.                         <b class="jrxy">今日幸运儿：</b>
  59.                     </div>
  60.                     <div id="userContainer" style="margin-top: 10px;">
  61.                         <ul class="users" id="usersScroll" >
  62.                             <!--<li><span class="username">用户361***48</span><span class="giftname">5Q币</span></li>-->
  63.                             <!--<li><span class="username">用户361***48</span><span class="giftname">5Q币</span></li>-->
  64.                             <!--<li><span class="username">用户361***48</span><span class="giftname">5Q币</span></li>-->
  65.                         </ul>
  66.                     </div>
  67.                     <div><a href="#" class="prevMygift" data-stats="prevGifts">上一期的奖品</a></div>
  68.                     <div class="mygift"><a href="#" data-stats="lottery.mygifts">我的抽奖记录( <span id="giftcount">0</span> )</a></div>
  69.                 </div>
  70.             </div>
  71.             
  72.         </div>
  74.         <div class="gift-wrap">
  75.             <div class="gift1 gift">
  76.                 <img src="../images/lottery/qb.png" alt=""/>
  77.                 <div class="giftinfo">恭喜抽到 <span class="gname">Q币</span></div>
  78.                 <div class="tip" id="qqtip">
  79.                     已转入您的QQ帐号中 <a href="http://my.pay.qq.com/account/index.shtml?ADTAG=PAY.MYPAY.INDEX.QQTIPS_RECHARGE" target="_blank">查看</a>
  80.                 </div>
  81.                 <div class="tip" id="jbtip">
  82.                     已存入我的安全金币中
  83.                 </div>
  84.                 <div class="tip" id="cdkeyTip">
  85.                 </div>
  86.                 <div style="font-size: 0;">
  87.                     <div class="btn again">再抽一次</div>
  88.                     <div class="btn drowdown">
  89.                         分享
  90.                         <ul>
  91.                             <li><a class="weibo" href="javascript:void(0)" onclick="share('qqwb')">腾讯微博</a></li>
  92.                             <li><a class="qzone" href="javascript:void(0)" onclick="share('qzone')">QQ空间</a></li>
  93.                             <li><a class="sina" href="javascript:void(0)" onclick="share('sina')">新浪微博</a></li>
  94.                         </ul>
  95.                     </div>
  96.                 </div>
  97.             </div>
  99.             <div class="tks gift" style="  margin-top: -118px;">
  100.                 <img src="../images/lottery/tks.png" alt=""/>
  101.                 <p style="color: #333333; margin-bottom: 0; font-size: 16px;">没抽到～</p>
  102.                 <p style="margin-top: 0;">很遗憾，运气还差那么一点哦～！</p>
  103.                 <a href="#" style="margin-top: 8px;" class="btn again">再抽一次</a>
  104.             </div>
  106.             <div class="addrgift gift">
  107.                 <img src="../images/lottery/img1.png" alt=""/>
  108.                 <div class="giftinfo">恭喜抽到 <span class="gname">QQ安全抱枕</span>，<a href="#" onclick="addr();return false;">请填写收货信息！</a></div>
  109.                 <div style="font-size: 0;">
  110.                     <div class="btn again">再抽一次</div>
  111.                     <div class="btn drowdown">
  112.                         分享
  113.                         <ul>
  114.                             <li><a class="weibo" href="javascript:void(0)" onclick="share('qqwb')">腾讯微博</a></li>
  115.                             <li><a class="qzone" href="javascript:void(0)" onclick="share('qzone')">QQ空间</a></li>
  116.                             <li><a class="sina" href="javascript:void(0)" onclick="share('sina')">新浪微博</a></li>
  117.                         </ul>
  118.                     </div>
  119.                 </div>
  120.             </div>
  121.         </div>
  123.         <div class="mygift-wrap">
  124.             <!--<div style="margin-top: 15px; margin-bottom: 15px;"><a href="#" onclick="goLottery();return false;" class="return">返回</a></div>-->
  125.             <div class="no-mygifts">
  126.                 抱歉，您还没有奖品哦，下次加油，么么哒~
  127.             </div>
  128.             <table>
  129.                 <thead>
  130.                 <tr>
  131.                     <td>奖品内容</td>
  132.                     <td>到帐情况</td>
  133.                     <td>领取时间</td>
  134.                 </tr>
  135.                 </thead>
  136.                 <tbody>
  137.                 <tr>
  138.                     <td>1Q比</td>
  139.                     <td>24小时内到帐</td>
  140.                     <td>2015-6-12   19:35:50</td>
  141.                 </tr>
  142.                 </tbody>
  143.             </table>
  144.         </div>
  146.         <div class="addr-wrap">
  147.             <a href="#" class="return" style="margin-top: 10px;" onclick="mygifts();return false;">返回上一页</a>
  148.             <div class="addr_tb">
  149.                 <table width="100%" class="k_tb" border="0" cellspacing="0" cellpadding="0">
  150.                     <tr>
  151.                         <td width="30%" align="right"><span class="red">*</span>姓名：</td>
  152.                         <td><input type="text" name="name" id="goodsName" class="input_w1"></td>
  153.                     </tr>
  154.                     <tr>
  155.                         <td align="right"><span class="red">*</span>电话号码：</td>
  156.                         <td><input type="text" name="phone" id="goodsPhone" class="input_w1" validity="name:联系电话;required:true;format:numb;minlen:7;maxlen:20" ></td>
  157.                     </tr>
  158.                     <tr>
  159.                         <td align="right">性别：</td>
  160.                         <td>
  161.                             <label>
  162.                                 <input type="radio" name="gender" value="男" checked="checked">男
  163.                             </label>
  164.                             <label>
  165.                                 <input type="radio" name="gender" value="女">女
  166.                             </label>
  167.                         </td>
  168.                     </tr>
  169.                     <tr>
  170.                         <td align="right"><span class="red">*</span>所在地：</td>
  171.                         <td>
  172.                             <select name="province" id="currProv"><option value="">省份</option></select>
  173.                             <select name="city" style="display:none;" id="currCity"><option value="">城市</option></select>
  174.                         </td>
  175.                     </tr>
  176.                     <tr>
  177.                         <td align="right"><span class="red">*</span>详细地址：</td>
  178.                         <td><input type="text" name="address" id="goodsAddr" class="input_w1"></td>
  179.                     </tr>
  180.                     <tr>
  181.                         <td align="right"><span class="red">*</span>邮编：</td>
  182.                         <td><input type="text" name="postcode" id="goodsCode" class="input_w1"></td>
  183.                     </tr>
  184.                     <tr>
  185.                         <td></td>
  186.                         <td style="text-align: left;">
  187.                             <!--<input class="sendmsg btn" type="button" value="确认提交" name="send">-->
  188.                             <div class="sendmsg btn" style="margin-top: 13px;">确认提交</div>
  189.                             <span id="rettip"></span>
  190.                         </td>
  191.                     </tr>
  192.                 </table>
  193.             </div>
  194.         </div>
  195.     </div>
  196. </div>
  197. <script type="text/javascript" src="http://pc1.gtimg.com/js/jquery-1.7.2.min.js"></script>
  198. <script src="../js/underscore-min.js"></script>
  199. <script type="text/javascript" src="http://guanjia.qq.com/assets/js/addr.js"></script>
  200. <script type="text/javascript" src="http://ossweb-img.qq.com/images/js/roleselector/roleselectorv3.js"></script>
  201. <script type="text/javascript" src="../js/comm.js"></script>
  202. <script src="../js/lottery.js"></script>
  203. <script>
  204.     $(".addr_tb .sendmsg").click(function () {
  205.         checkGoods()
  206.     });
  207.     function setAddrResult(a){
  208.         if(a.code == 0){
  209.             alert("提交成功，奖品将在活动结束后30个工作日内派送。");
  210.         }else{
  211.             alert("提交失败，请重试");
  212.         }
  213.     }
  214. </script>
  215. </body>
  216. </html>





posted @ 2016-01-14 09:49  LookPHP  阅读(330)  评论(0)    收藏  举报