Keine Beschreibung

index.html 5.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
  1. <!DOCTYPE html>
  2. <html>
  3. <meta charset="UTF-8">
  4. <meta content="yes" name="apple-mobile-web-app-capable">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,minimum-scale=1.0,user-scalable=0" />
  6. <title>拉新拿奖</title>
  7. <link rel="stylesheet" type="text/css" href="../public/public_css.css"/>
  8. <style type="text/css">
  9. body{min-height:100vh;-webkit-overflow-scrolling:touch;}
  10. em{font-style: normal;}
  11. .container{width: 100%;height: 100%;background: #F4F4F4;}
  12. .banner{height:2.435rem;background:url(images/001.png) no-repeat 0 0;background-size:100% 2.435rem;}
  13. .banner a{display: block;float: right;color: #fff;font-size: 0.14rem;text-align: center;background-color: rgba(122, 62, 254, .7); padding: 0.05rem 0.1rem;border-radius: 0.1rem; margin-right: 0.15rem;margin-top: 0.15rem;}
  14. .banner_unite{width: 100%;height: 2.025rem;background: url(images/002.png) no-repeat -0.06rem 0;background-size: 104% 2.025rem; position: absolute;top: 2.2rem;left: 0;}
  15. .banner_step{width: 100%;height: 5.29rem;background:url(images/003.png) no-repeat -0.382rem 0;background-size: 116% 108%; position: absolute;top: 3.9rem; left: 0;}
  16. .banner_strategy{width: 100%;height: 11.88rem;background: url(images/004.png) no-repeat 0 0;background-size: 100% 11.88rem; padding-bottom: 0.48rem; position: absolute;top: 8.96rem;left: 0;}
  17. .footer{width: 100%;height: 0.49rem;position: fixed;bottom: 0; overflow: hidden;}
  18. .footer div{width: 50%;height: 0.49rem;float: left;line-height: 0.49rem;color: #fff;font-size: 0.18rem;letter-spacing: 0.01rem;}
  19. .footer #face-to-face{background: #F33056;}
  20. .footer #face-to-face img{float:left;display:block;width: 0.29rem;height: 0.29rem;margin-top: 0.1rem;margin-left: 0.32rem;margin-right: 0.06rem;}
  21. .footer #share{text-align: center;background: #FA5048;}
  22. .shareMask{display: none;width: 100%;height: 100%;background: rgba(0,0,0,0.5036);position: absolute;top: 0;left: 0;}
  23. .weixin{position: fixed;bottom: 0;background: #ffffff;width: 100%;}
  24. .weixins{background: rgba(216,216,216,0.2);width: 100%;display: -webkit-flex;display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: flex;justify-content: space-around;}
  25. .weixins div{text-align: center;}
  26. .weixins div img{display: block;width: 0.44rem;height: 0.44rem;margin: auto;margin-top: 0.22rem;margin-bottom: 0.12rem;}
  27. .weixins div span{font-size: 0.12rem;line-height: 0.17rem;color: #555555;margin-bottom: 0.16rem;display: inline-block;}
  28. .cancel{line-height: 0.4rem;font-size: 0.15rem;color: #555555;text-align: center;}
  29. </style>
  30. <script type="text/javascript">
  31. document.documentElement.style.fontSize = 100 * (document.documentElement.clientWidth/375) + "px";
  32. window.onresize = function(){
  33. document.documentElement.style.fontSize = 100 * (document.documentElement.clientWidth/375) + "px";
  34. }
  35. </script>
  36. </head>
  37. <body>
  38. <div class="container">
  39. <div class="banner">
  40. <a href="earnings.html">我的收益</a>
  41. </div>
  42. <div class="banner_unite"></div>
  43. <div class="banner_step"></div>
  44. <div class="banner_strategy"></div>
  45. <div class="footer">
  46. <div id="face-to-face"><img src="images/code.png"/>面对面邀请</div>
  47. <div id="share">立即邀请好友</div>
  48. </div>
  49. <div class="shareMask">
  50. <div class="weixin">
  51. <div class="weixins">
  52. <div class="weixinShare" onclick="shareWeixin()">
  53. <img src="images/weixin.png" />
  54. <span>微信</span>
  55. </div>
  56. <div class="pengyouquan" onclick="sharePengyouquan()">
  57. <img src="images/weixinQuan.png"/>
  58. <span>朋友圈</span>
  59. </div>
  60. </div>
  61. <div class="cancel">取消分享</div>
  62. </div>
  63. </div>
  64. </div>
  65. </body>
  66. </html>
  67. <script type="text/javascript" src="../public/jquery-2.1.0.js"></script>
  68. <script type="text/javascript">
  69. var userId = null;
  70. var activity_id = null;
  71. var share_code = null;
  72. var str=location.href; //取得整个地址栏
  73. var num=str.indexOf("?");
  74. str=str.substr(num+1); //str得到?之后的字符串
  75. var brr=str.split("&");
  76. for(var i = 0 ; i<brr.length; i++){
  77. if(brr[i].indexOf('userId') != -1){
  78. userId = brr[i].split('=')[1];//用户id
  79. localStorage.setItem('userId', userId);
  80. }
  81. if(brr[i].indexOf('activity_id') != -1){
  82. activity_id = brr[i].split('=')[1];//活动id
  83. localStorage.setItem('activity_id', activity_id);
  84. }
  85. if(brr[i].indexOf('share_code') != -1){
  86. share_code = brr[i].split('=')[1];
  87. }
  88. }
  89. $(".shareMask").click(function(e){
  90. $(".shareMask").css('display','none')
  91. })
  92. $(".weixins").click(function(e){
  93. e.preventDefault();
  94. return false
  95. })
  96. var jsons = {
  97. title:'@你,快来瓜分10000个红包!',
  98. desc:'福利放送!淘宝无门槛购物红包天天领!来看看你的手气~',
  99. url:'http://mzb.quyaqu.com/share/index.html?userId=' + userId
  100. };
  101. jsons = JSON.stringify(jsons);
  102. function shareWeixin () {
  103. if(navigator.userAgent.indexOf('Android') != -1){
  104. messageHandlers.shareWithWechatSession(jsons)
  105. }else{
  106. window.webkit.messageHandlers.shareWithWechatSession.postMessage(jsons)
  107. }
  108. }
  109. function sharePengyouquan () {
  110. if(navigator.userAgent.indexOf('Android') != -1){
  111. messageHandlers.shareWithWechatTimeline(jsons)
  112. }else{
  113. window.webkit.messageHandlers.shareWithWechatTimeline.postMessage(jsons)
  114. }
  115. }
  116. $("#share").click(function () {
  117. $(".shareMask").css('display','block')
  118. })
  119. $(".cancel").click(function () {
  120. $(".shareMask").css('display','none')
  121. })
  122. $("#face-to-face").click(function () {
  123. window.location.href = 'faceToFace.html'
  124. })
  125. </script>