index.htm 9.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
  6. <title>大吉大利 “野性”吃鸡</title>
  7. <meta name="description" itemprop="description" content="<!--{echo $we_shareDesc}-->" />
  8. <script type="text/javascript" src="<!--{echo $we_staticDir}-->js/jquery-3.2.1.min.js"></script>
  9. <!-- http://res.wx.qq.com/open/js/jweixin-1.0.0.js -->
  10. <!-- http://res.wx.qq.com/open/js/jweixin-1.2.0.js -->
  11. <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
  12. <style type="text/css">
  13. * {
  14. -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  15. /*
  16. // 禁止Android系统弹出复制菜单
  17. -webkit-touch-callout:none;
  18. -webkit-user-select:none;
  19. -khtml-user-select:none;
  20. -moz-user-select:none;
  21. -ms-user-select:none;
  22. user-select:none;
  23. touch-callout:none;
  24. */
  25. }
  26. html, body, div, p, h1, h2, h3, h4, h5, ol, ul, li, dl, dt, dd {
  27. padding: 0;
  28. margin: 0
  29. }
  30. html {
  31. font-family: "Helvetica Neue", Helvetica, STHeiTi, "Microsoft YaHei", sans-serif;
  32. -webkit-text-size-adjust: 100%;
  33. }
  34. body {
  35. font-size: 14px;
  36. background: #fef7f1;
  37. line-height: 1.5;
  38. //height: 2272px;
  39. }
  40. img {
  41. vertical-align: middle;
  42. border: 0
  43. }
  44. html,#app {
  45. width: 100%;
  46. height: 100%;
  47. overflow-x: hidden
  48. }
  49. body{
  50. width: 100%;
  51. }
  52. #app {
  53. max-width: 640px;
  54. // height: 2272px;
  55. margin: 0 auto;
  56. position: relative;
  57. background: #fef7f1;
  58. }
  59. #pg1 {
  60. width: 100%;
  61. height: 100%;
  62. position: absolute;
  63. overflow-x: hidden;
  64. background: url(<!--{echo $we_staticDir}-->bg_chiji.png) no-repeat center top;
  65. background-size: 100%;
  66. }
  67. #inputs{
  68. width: 100%;
  69. height: 100%;
  70. position: absolute;
  71. // position: fixed;
  72. overflow-x: hidden;
  73. bottom: 0px;
  74. }
  75. form{
  76. width: 100%;
  77. // height: 100%;
  78. position: absolute;
  79. overflow-x: hidden;
  80. }
  81. form input{
  82. font-size: 24px;
  83. }
  84. table{
  85. position: absolute;
  86. margin: 0 auto;
  87. // width: 100%;
  88. }
  89. .udata{
  90. background: url(<!--{echo $we_staticDir}-->lab_input.png) left top no-repeat;
  91. background-size: 100% 100%;
  92. color: #FFFFFF;
  93. border: 0;
  94. padding-left: 8px;
  95. padding-right: 8px;
  96. // height: 38px;
  97. // height: 98%;
  98. width: 196px;
  99. height: 37px;
  100. }
  101. .uimg{
  102. height: 38px;
  103. // width: 23%;
  104. }
  105. .invisible {
  106. opacity:0;
  107. filter:alpha(opacity=0);
  108. position:absolute;
  109. left:-320px;
  110. top:-480px;
  111. z-index:0;
  112. }
  113. /*
  114. #commit{
  115. background: url(<!--{echo $we_staticDir}-->btn_sure.png) center center no-repeat;
  116. background-size: auto 100%;
  117. border: none;
  118. width: 291px;
  119. height: 111px;
  120. //width: 100%;
  121. //height: 100%;
  122. margin: 0 auto;
  123. }
  124. */
  125. .tleft{
  126. text-align: right;
  127. width: 256px;
  128. }
  129. .tright{
  130. text-align: left;
  131. // width: 60%;
  132. }
  133. </style>
  134. <script>
  135. function _htmlDecode(value){
  136. return $('<div/>').html(value).text();
  137. }
  138. var shareIconUrl = "<!--{echo $we_shareIconUrl}-->";
  139. shareIconUrl = _htmlDecode(shareIconUrl);
  140. wx.config({
  141. debug: false,
  142. appId: "<!--{echo $we_appid;}-->",
  143. timestamp: <!--{echo $we_timestamp;}-->,
  144. nonceStr: "<!--{echo $we_nonceStr;}-->",
  145. signature: "<!--{echo $we_signature;}-->",
  146. jsApiList: [
  147. 'checkJsApi',
  148. 'onMenuShareTimeline',
  149. 'onMenuShareAppMessage',
  150. // 'onMenuShareQQ',
  151. // 'onMenuShareWeibo',
  152. // 'chooseImage',
  153. // 'uploadImage',
  154. // 'previewImage'
  155. ]
  156. });
  157. wx.ready(function () {
  158. var shareConfig = {
  159. title: '大吉大利 “野性”吃鸡',
  160. desc: '<!--{echo $we_shareDesc}-->',
  161. link: window.location.href,
  162. imgUrl: shareIconUrl,
  163. };
  164. wx.onMenuShareAppMessage(shareConfig);
  165. wx.onMenuShareTimeline(shareConfig);
  166. wx.error(function (res) {
  167. alert(res.errMsg);
  168. });
  169. // alert(JSON.stringify(shareConfig));
  170. });
  171. $(document).ready(function() {
  172. /** * 返回顶部处理 */
  173. var _objscroll = {
  174. win: $(window),
  175. doc: $(document),
  176. slidediv: $('#tips'),
  177. mainDiv: $('#mainDiv')
  178. };
  179. _objscroll.win.scroll(function() {
  180. // console.log('scrolltop: ' + _objscroll.win.scrollTop());
  181. // console.log('height: ' + _objscroll.win.height() + ' ' + _objscroll.mainDiv.height());
  182. if (_objscroll.win.scrollTop() >= _objscroll.mainDiv.height() - _objscroll.win.height() - 80) {
  183. _objscroll.slidediv.hide();
  184. } else {
  185. _objscroll.slidediv.show();
  186. }
  187. });
  188. /*
  189. margin-left:-130px; width: 260px;
  190. */
  191. console.log('mainDiv width=' + $('#mainBg').width());
  192. var w = $('#mainBg').width() * (260.0 / 640.0);
  193. $('#btnDiv').css({
  194. 'margin-left': (-w / 2) + 'px',
  195. 'width': w + 'px'
  196. });
  197. });
  198. </script>
  199. </head>
  200. <body>
  201. <img src="<!--{echo $we_staticDir}-->icon_640.png" class="invisible" id="hideicon" />
  202. <script>
  203. function submitShare() {
  204. var value = document.getElementById("usr_name").value;
  205. if ( value.length == 0 ){
  206. alert('请输入昵称.');
  207. return false;
  208. }else if ( value.length > 8 ) {
  209. alert('昵称太长了.');
  210. return false;
  211. }
  212. value = document.getElementById("usr_kill").value;
  213. var isNum = /^[1-9]\d*$|^0$/;
  214. if ( true != isNum.test(value) ){
  215. alert('请输入一个有效的击杀数字.');
  216. return false;
  217. }
  218. var numVal = Number(value);
  219. if ( numVal < 1 || numVal > 99 ) {
  220. alert('请输入一个1-99之间的整数.');
  221. return false;
  222. }
  223. document.charset="utf-8";
  224. document.forms['shareForm'].submit();
  225. }
  226. </script>
  227. <form id="shareForm" name="shareForm" accept-charset="utf-8" method="GET" action="<!--{echo $we_shareUrl}-->">
  228. <div style="text-align: center; position: relative; top: 0px; margin: 0 auto;" id="mainDiv">
  229. <img id="mainBg" src="<!--{echo $we_staticDir}-->bg_chiji.png" style="max-width: 640px; width: 100%;" />
  230. <!--
  231. <div style="display: block; position: absolute; top: 40%; left: 0px; width: 100%; z-index: 99999; text-align: center;">
  232. <div style="text-align: center; position: absolute; width: 100%; height: 100%;">
  233. </div>
  234. </div>
  235. -->
  236. <table style="position: absolute; top: 32%; left: 50%; margin-left:-320px; width: 640px; z-index: 99999;">
  237. <tr>
  238. <td class="tleft">
  239. <img class="uimg" src="<!--{echo $we_staticDir}-->text_name.png"/>
  240. </td>
  241. <td class="tright">
  242. <input class="udata" id="usr_name" name="usr_name" type="text"/>
  243. </td>
  244. </tr>
  245. <tr>
  246. <!-- blank row -->
  247. <td><br/></td>
  248. <td><br/></td>
  249. </tr>
  250. <tr>
  251. <td class="tleft">
  252. <img class="uimg" src="<!--{echo $we_staticDir}-->text_kill.png"/>
  253. </td>
  254. <td class="tright">
  255. <input class="udata" id="usr_kill" name="usr_kill" type="text"/>
  256. </td>
  257. </tr>
  258. <tr>
  259. <!-- blank row -->
  260. <td><br/></td>
  261. <td><br/></td>
  262. </tr>
  263. <!--
  264. <tr>
  265. <td colspan="2" style="text-align: center;">
  266. <a style="margin: 0 auto;" href="#" onclick="submitShare(); return false;">
  267. <img src="btn_sure.png"/>
  268. </a>
  269. </td>
  270. </tr>
  271. -->
  272. </table>
  273. <!--
  274. <a style="margin: 0 auto;" href="#" onclick="submitShare(); return false;">
  275. <img src="<!--{echo $we_staticDir}-->btn_sure.png" style="width: 26%;"/>
  276. </a>
  277. -->
  278. <p style="display: inline; position: absolute; bottom: 32px; left: 50%; margin-left:-130px; width: 260px; z-index: 99999;" id="btnDiv"><img src="<!--{echo $we_staticDir}-->btn_sure.png" style="width: 100%;margin: 0 auto;" onclick="submitShare(); return false;"/></p>
  279. </div>
  280. <input type="hidden" name="img_id" id="img_id" value="<!--{echo $we_imgId}-->"/>
  281. <input type="hidden" name="label_id" id="label_id" value="<!--{echo $we_labelId}-->"/>
  282. </form>
  283. <div id="tips" style="display: inline;position: fixed; bottom: 10px; width: 7.2%; right: 10px;z-index: 9999;" ontouchstart="return false;">
  284. <img src="<!--{echo $we_staticDir}-->slide.png" style="width: 100%" ontouchstart="return false;"/>
  285. </div>
  286. <!--
  287. <div id="tips" style="position: fixed; width: 640px; bottom: 10px; right: 10px;z-index: 9999;">
  288. <img src="<!--{echo $we_staticDir}-->slide.png" style=""/>
  289. </div>
  290. -->
  291. <script>
  292. $('#hideicon').attr('src', shareIconUrl);
  293. </script>
  294. </body>
  295. </html>