No Description

receiveRedEnvelope.html 2.2KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta content="no" name="apple-mobile-web-app-capable">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,minimum-scale=1.0,user-scalable=0" />
  7. <link rel="stylesheet" type="text/css" href="../common/reset.css"/>
  8. <link rel="stylesheet" type="text/css" href="css/receiveRedEnvelope.css"/>
  9. <script type="text/javascript" src="../common/jquery-2.1.0.js"></script>
  10. <title>双十二</title>
  11. <script type="text/javascript">
  12. document.documentElement.style.fontSize = 100 * (document.documentElement.clientWidth/375) + "px";
  13. window.onresize = function(){
  14. document.documentElement.style.fontSize = 100 * (document.documentElement.clientWidth/375) + "px";
  15. }
  16. </script>
  17. <style type="text/css">
  18. #copy_1,#copy_2{
  19. position: absolute;
  20. left: -1000rem;
  21. }
  22. .alert-info {
  23. position: fixed;
  24. top: 1.74rem;
  25. right: 0;
  26. left: 0;
  27. bottom: 0;
  28. text-align: center;
  29. }
  30. .alert-info p {
  31. display: inline-block;
  32. height: 0.38rem;
  33. color: #fff;
  34. font-size: 0.14rem;
  35. line-height: 0.38rem;
  36. padding: 0 0.10rem;
  37. background-color: rgba(0, 0, 0, 0.7);
  38. border-radius: 5px;
  39. }
  40. </style>
  41. </head>
  42. <body>
  43. <!--复制壳子-->
  44. <input id="copy_1" type="text" readOnly="true" value=""/>
  45. <div id="copy_2"></div>
  46. <!--内容-->
  47. <div class="container">
  48. <div class="receiveButton" id="getRedEnvelope">领取红包</div>
  49. <div class="receiveButton receiveTklButton" id="getTkl">分享淘口令</div>
  50. <p class="hint">分享给好友,好友领取红包后购物,你也有佣金</p>
  51. </div>
  52. <!--toast-->
  53. <div class="alert-info" style="display: none;">
  54. <!-- tip提示,3s后消失 -->
  55. <p></p>
  56. </div>
  57. <!--复制成功弹框-->
  58. <div class="copyMask">
  59. <div class="maskContent">
  60. <h3>口令已复制</h3>
  61. <div class="tkl"></div>
  62. <div class="copyMaskButton">请打开微信,分享红包</div>
  63. <img src="img/close.png" class="close" onclick="closeMask()"/>
  64. </div>
  65. </div>
  66. </body>
  67. </html>
  68. <script type="text/javascript" src="js/receiveRedEnvelope.js"></script>