tastypear commited on
Commit
546d3dc
·
verified ·
1 Parent(s): d70e29c

Create wechat

Browse files
Files changed (1) hide show
  1. wechat +345 -0
wechat ADDED
@@ -0,0 +1,345 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1, minimum-scale=1, user-scalable=no">
6
+ <script type="text/javascript" src="static/js/jquery.min.js"></script>
7
+ <script type="text/javascript" src="static/js/base64.min.js"></script>
8
+ <style>
9
+ blockquote, body, dd, dir, dl, fieldset, figure, form, h1, h2, h3, h4, h5, h6, hr, input, legend, menu, ol, optgroup, p, pre, tbody, td, textarea, tfoot, th, thead, ul {
10
+ margin: 0;
11
+ padding: 0
12
+ }
13
+
14
+ ol, ul {
15
+ list-style-type: none;
16
+ list-style-image: none
17
+ }
18
+
19
+ body, button, input, select, textarea {
20
+ -ms-text-autospace: ideograph-alpha ideograph-numeric ideograph-parenthesis;
21
+ text-autospace: ideograph-alpha ideograph-numeric ideograph-parenthesis
22
+ }
23
+
24
+ h1, h2, h3, h4, h5, h6 {
25
+ font-weight: 400
26
+ }
27
+
28
+ * {
29
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
30
+ }
31
+
32
+ body {
33
+ background: #F6F5F7;
34
+ }
35
+
36
+ .beatHeader {
37
+ background: #494A4D;
38
+ height: 50px;
39
+ width: 100%;
40
+ position: relative;
41
+ z-index: 1;
42
+ overflow: hidden;
43
+ }
44
+
45
+ .beatMain {
46
+ position: relative;
47
+ /*z-index: 2;
48
+ padding: 0 16px;*/
49
+ margin: 14px;
50
+ margin-top: 20px;
51
+ }
52
+
53
+ .beatMain .imgContainer {
54
+ padding: 0 16px;
55
+ margin-top: 14px;
56
+ margin-bottom: 14px;
57
+ }
58
+
59
+ .beatMain .imgContainer img {
60
+ width: 100%;
61
+ height: auto;
62
+ box-shadow: 0px 3px 12px rgba(21, 0, 71, 0.16);
63
+ }
64
+
65
+ .beatMain .moonTitleContainer {
66
+ font-size: 14px;
67
+ color: rgba(0, 0, 0, 0.4);
68
+ margin-bottom: 16px;
69
+ }
70
+
71
+ .beatMain .moonTitleContainer span {
72
+ color: #FF5500;
73
+ margin-right: 16px;
74
+ }
75
+
76
+ .beatMain .itemContent {
77
+ font-size: 14px;
78
+ color: rgba(0, 0, 0, 0.80);
79
+ line-height: 21px;
80
+ text-align: left;
81
+ margin-bottom: 10px;
82
+ }
83
+
84
+ .beatMain .itemPrice {
85
+ font-family: STHeitiSC-Light;
86
+ font-size: 16px;
87
+ color: #FF5500;
88
+ line-height: 16.5px;
89
+ text-align: right;
90
+ margin-bottom: 10px;
91
+ }
92
+
93
+ .beatMain .itemTips {
94
+ font-size: 12px;
95
+ color: rgba(0,0,0,.4);
96
+ text-align: center;
97
+ }
98
+
99
+ .beatWord {
100
+ text-align: center;
101
+ }
102
+
103
+ .beatWord fieldset {
104
+ padding: 0.5rem;
105
+ border: 1px dashed #f54d23;
106
+ background: #fff;
107
+ border-radius: 5px;
108
+ }
109
+
110
+ .beatWord fieldset legend {
111
+ background: #f54d23;
112
+ border: none;
113
+ font-size: 0.8rem;
114
+ line-height: 20px;
115
+ color: #fff;
116
+ padding: 0 4px;
117
+ }
118
+
119
+ .itemCopy {
120
+ border-radius: 5px;
121
+ color: white;
122
+ font-size: 14px;
123
+ margin: 2px auto;
124
+ padding: 10px;
125
+ margin-bottom: 2px;
126
+ border: none;
127
+ background-color: #fb6a65;
128
+ width: 100%;
129
+ }
130
+ .copy-tip {
131
+ display: flex;
132
+ justify-content: space-around;
133
+ align-items: center;
134
+ background: linear-gradient(to right, #f9c492, #fb6a65);
135
+ color: white;
136
+ font-size: 12px;
137
+ height: 24px;
138
+ border-radius: 5px;
139
+ }
140
+ .jtone {
141
+ position: relative;
142
+ width: 0;
143
+ height: 0;
144
+ border-top: 12px solid transparent;
145
+ border-left: 10px solid white;
146
+ border-bottom: 12px solid transparent;
147
+ }
148
+ .jtone::before {
149
+ content: "";
150
+ position: absolute;
151
+ top: -12px;
152
+ left: -13px;
153
+ width: 0;
154
+ height: 0;
155
+ border-top: 12px solid transparent;
156
+ border-left: 10px solid #fab189;
157
+ border-bottom: 12px solid transparent;
158
+ }
159
+ .jttwo {
160
+ position: relative;
161
+ width: 0;
162
+ height: 0;
163
+ border-top: 12px solid transparent;
164
+ border-left: 10px solid white;
165
+ border-bottom: 12px solid transparent;
166
+ }
167
+ .jttwo::before {
168
+ content: "";
169
+ position: absolute;
170
+ top: -12px;
171
+ left: -13px;
172
+ width: 0;
173
+ height: 0;
174
+ border-top: 12px solid transparent;
175
+ border-left: 10px solid #fa9b7e;
176
+ border-bottom: 12px solid transparent;
177
+ }
178
+ .jtthree {
179
+ position: relative;
180
+ width: 0;
181
+ height: 0;
182
+ border-top: 12px solid transparent;
183
+ border-left: 10px solid white;
184
+ border-bottom: 12px solid transparent;
185
+ }
186
+ .jtthree::before {
187
+ content: "";
188
+ position: absolute;
189
+ top: -12px;
190
+ left: -13px;
191
+ width: 0;
192
+ height: 0;
193
+ border-top: 12px solid transparent;
194
+ border-left: 10px solid #fa8673;
195
+ border-bottom: 12px solid transparent;
196
+ }
197
+ .loader-container {
198
+ display: inline-block;
199
+ height: 250px;
200
+ width: 100%;
201
+ }
202
+ .loader {
203
+ position: relative;
204
+ margin: 0 auto;
205
+ margin-top: 100px;
206
+ }
207
+ .eight {
208
+ width: 100px;
209
+ height: 100px;
210
+ border-radius: 50%;
211
+ animation: loader8Animation 1.5s linear infinite;
212
+ margin-top: 25px;
213
+ margin-left: auto;
214
+ margin-right: auto;
215
+ }
216
+ .eight:before {
217
+ width: 20px;
218
+ height: 20px;
219
+ content: "";
220
+ position: absolute;
221
+ background-color: transparent;
222
+ top: 40px;
223
+ left: 40px;
224
+ border-radius: 50%;
225
+ box-shadow: 0px -50px 0px 0px rgb(159 236 136), -36px -36px 0px -1px rgb(159 236 136 / 88%), -50px 0px 0px -2px rgb(159 236 136 / 75%), -36px 36px 0px -3px rgb(159 236 136 / 63%), 0px 50px 0px -4px rgb(159 236 136 / 50%), 36px 36px 0px -5px rgb(159 236 136 / 38%), 50px 0px 0px -6px rgb(159 236 136 / 25%), 36px -36px 0px -7px rgb(159 236 136 / 13%);
226
+ }
227
+ @keyframes loader8Animation {
228
+ 0% {
229
+ transform: rotate(0deg)
230
+ }
231
+
232
+ 100% {
233
+ transform: rotate(360deg)
234
+ }
235
+ }
236
+
237
+ </style>
238
+ </head>
239
+ <body>
240
+
241
+ <div style="border: 1px ; max-width: 600px; margin: 0 auto;">
242
+ <div class="beatMain">
243
+ <div id="loader8" class="loader-container">
244
+ <div class="loader eight"></div>
245
+ </div>
246
+ <div class="imgContainer">
247
+ <img id="img" src="" alt="">
248
+ </div>
249
+
250
+ <div class="beatWord">
251
+ <fieldset>
252
+
253
+ <p id="itemWord" class="itemWord"><span id="taokey"></span></p>
254
+ </fieldset>
255
+ <button id="copy" type="button" data-clipboard-text="" class="itemCopy">一键复制</button>
256
+ </div>
257
+ <div id="copy-tip" class="copy-tip">
258
+ <span>长按框内</span>
259
+ <span class="jtone"></span>
260
+ <span>全选</span>
261
+ <span class="jttwo"></span>
262
+ <span>复制</span>
263
+ <span class="jtthree"></span>
264
+ <span><img src="https://weixin.qq.com/zh_CN/htmledition/images/wechat_logo_109.2x219536.png" style="width: 18px;vertical-align: middle;">粘贴到微信聊天</span>
265
+ </div>
266
+ </div>
267
+ </div>
268
+
269
+ <script type="text/javascript" src="static/js/clipboard.min.js"></script>
270
+
271
+ <script>
272
+
273
+ function rnd() {
274
+ // var random = Math.floor(Math.random() * (m - n + 1) + n);
275
+ var num = Math.ceil(Math.random()*10) - 1;
276
+ return num;
277
+ }
278
+
279
+ function getParams(paras){
280
+ var url = decodeURI(location.href);
281
+ // var url = location.href;
282
+ var paraString = url.substring(url.indexOf("?") + 1, url.length).split("&");
283
+ var returnValue;
284
+ for (i = 0; i < paraString.length; i++) {
285
+ var tempParas = paraString[i].split('=')[0];
286
+ var parasValue = paraString[i].split('=')[1];
287
+ if (tempParas === paras)
288
+ returnValue = parasValue;
289
+ }
290
+ if (typeof(returnValue) == "undefined") {
291
+ return "";
292
+ } else {
293
+ return returnValue;
294
+ }
295
+ }
296
+
297
+ $(function(){
298
+ var taowords = decodeURIComponent(getParams('taowords'));
299
+ var url = decodeURIComponent(getParams('url'));
300
+ var image = Base64.decode(decodeURIComponent(getParams('image')));
301
+ var taowords = ''
302
+ $('#img').attr('src', image);
303
+ $('#coupons').attr('href',url);
304
+ $('#copy').attr('data-clipboard-text', taowords);
305
+ $('#taokey').text(taowords);
306
+ if(image != ''){
307
+ img.onload = function () {
308
+ $('#loader8').hide();
309
+ }
310
+ }else{
311
+ $('#loader8').hide();
312
+ }
313
+ })
314
+
315
+
316
+ //复制文本
317
+ var clipboard = new Clipboard('.itemCopy');
318
+ clipboard.on('success',
319
+ function(e) {
320
+ if (e.trigger.disabled == false || e.trigger.disabled == undefined) {
321
+ e.trigger.innerHTML = "已复制,粘贴到微信聊天打开";
322
+ e.trigger.style.backgroundColor = "#9ED29E";
323
+ e.trigger.style.borderColor = "#9ED29E";
324
+ //e.clearSelection();
325
+ e.trigger.disabled = true;
326
+ //2秒后按钮恢复原状
327
+ setTimeout(function() {
328
+ e.trigger.innerHTML = "一键复制";
329
+ e.trigger.style.backgroundColor = "#f54d23";
330
+ e.trigger.style.borderColor = "#f54d23";
331
+ e.trigger.disabled = false;
332
+ },
333
+ 2000);
334
+ }
335
+ });
336
+
337
+ clipboard.on('error',
338
+ function(e) {
339
+ e.trigger.innerHTML = "复制失败";
340
+ e.trigger.style.backgroundColor = "#8f8f8f";
341
+ e.trigger.style.borderColor = "#8f8f8f";
342
+ });
343
+ </script>
344
+ </body>
345
+ </html>