-
Notifications
You must be signed in to change notification settings - Fork 0
/
引导页.html
151 lines (142 loc) · 4.98 KB
/
引导页.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<title>E+账户实名认证</title>
<meta name="keywords" content="E+账户，钱途互联，实名验证">
<meta name="description" content="E+账户为用户提供安全便捷的身份实名认证软件，帮助用户通过手机完成人脸活体认证等">
<style>
body , div , h1, h2 ,a{
margin: 0;
padding: 0;
}
html{
height: 100%;
}
body {
height: 100%;
color: #fff;
-webkit-tap-highlight-color:rgba(0,0,0,0);
}
.wrap{
background:#ef8881 url("{{static}}/images/bg-h5.jpg") no-repeat 0 0;
background-size: 100% auto;
text-align: center;
width: 100%;
height: 100%;
max-width: 640px;
margin: 0 auto;
font-family: 'Microsoft YaHei',sans-serif;
position: relative;
}
.wrap h1{
font-size: 24px;
color: #fef6c9;
}
.wrap h2{
font-size: 14px;
padding: 0 0 10px 0;
font-weight: normal;
line-height: 20px;
}
.wrap .btn{
border-radius: 10px;
background: #fff;
padding: 10px 0 10px 0;
margin: 0 20%;
font-size: 16px;
color: #eb726a;
font-family: 'Microsoft YaHei',sans-serif;
text-decoration: none;
display: block;
box-shadow: 0 3px #9f5a56;
}
.wrap .wrap-text{
position: absolute;
left: 0;
bottom:2%;
width: 100%;
text-align: center;
}
.fade{
width: 100%;
height: 100%;
background: #000;
opacity: 0.7;
position: absolute;
top: 0;
left: 0;
display: none;
}
.fade-img{
display: none;
position: absolute;
top: 0;
right: 0;
width: 320px;
}
.fade-img img{
width: 100%;
}
a:focus,
button:focus {
outline: none;
}
</style>
</head>
<body>
<img src="http://www.frontpay.cn/Content/images/supply-banner.jpg?v=20160310" style="display:none" alt="">
<div class="wrap">
<div class="wrap-text">
<h1>在线实名认证</h1>
<h2>此App仅用于身份实名认证，不会在系统<br>内保存您的任何银行卡信息</h2>
<a class="btn" href="###" id="j-btn">下载安卓客户端</a>
</div>
</div>
<div class="fade"></div>
<div class="fade-img"><img src="{{static}}/images/h5-tips.png"> </div>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
window.onload = function() {
var UA = window.navigator.userAgent;
var btn = document.getElementById('j-btn');
var layer = document.querySelectorAll('.fade');
var img = document.querySelectorAll('.fade-img');
var isMicroMsg = /MicroMessenger/g.test(UA);
isMicroMsg && btn.addEventListener('click', function(e){
layer[0].style.display='block';
img[0].style.display='block';
this.blur();
e.preventDefault()
}, false)
wx.onMenuShareAppMessage({
title: 'E+账户实名认证', // 分享标题
desc: 'E+账户为用户提供安全便捷的身份实名认证软件，帮助用户通过手机完成人脸活体认证等', // 分享描述
link: location.href, // 分享链接
imgUrl: 'http://www.frontpay.cn/Content/images/supply-banner.jpg?v=20160310', // 分享图标
type: 'link', // 分享类型,music、video或link，不填默认为link
dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
success: function () {
// 用户确认分享后执行的回调函数
alert('成功')
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
wx.onMenuShareTimeline({
title: 'E+账户实名认证', // 分享标题
link: location.href, // 分享链接
imgUrl: 'http://www.frontpay.cn/Content/images/supply-banner.jpg?v=20160310', // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
}
</script>
</body>
</html>