Commit d0d4ab76 authored by jinghao's avatar jinghao

update third

parent d248a8d1
......@@ -4,5 +4,20 @@ module.exports = [
name: 'index',
html: 'home/index.html',
jsEntry: 'home/index.js'
},
{
name: 'error',
html: 'error/error.html',
jsEntry: 'error/error.js'
},
{
name: 'serviceAgreement',
html: 'serviceAgreement/serviceAgreement.html',
jsEntry: 'serviceAgreement/serviceAgreement.js'
},
{
name: 'privacyPolicy',
html: 'privacyPolicy/privacyPolicy.html',
jsEntry: 'privacyPolicy/privacyPolicy.js'
}
]
\ No newline at end of file
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>您访问的页面找不到了 - 万金易融 - 智能贷,更省心 - Yirong.com</title>
<!--[if lte IE 8]>
<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/grids-responsive-old-ie-min.css">
<![endif]-->
<!--[if gt IE 8]>
<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/grids-responsive-min.css">
<!<![endif]-->
<link rel="stylesheet" href="//unpkg.com/purecss@1.0.0/build/grids-responsive-min.css">
</head>
<div class="container">
<div class="nav-wrap">
<div class="custom-wrapper pure-g" id="menu">
<div class="pure-u-1 pure-u-md-1-3">
<div class="pure-menu">
<a href="#" class="pure-menu-heading custom-brand">
<img class="logo" src="../../images/logo.png" alt="万金易融">
<div class="text">万金信息旗下产品</div>
</a>
<a href="#" class="custom-toggle" id="toggle"><s class="bar"></s><s class="bar"></s></a>
</div>
</div>
<div class="pure-u-1 pure-u-md-2-3">
<div class="pure-menu pure-menu-horizontal custom-menu-3 custom-can-transform">
<ul class="pure-menu-list">
<li class="pure-menu-item"><a href="/" class="pure-menu-link active">首页</a></li>
<li class="pure-menu-item"><a href="#" class="pure-menu-link">产品服务</a></li>
<li class="pure-menu-item"><a href="#" class="pure-menu-link">融资攻略</a></li>
<li class="pure-menu-item"><a href="#" class="pure-menu-link">关于我们</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="error-wrap">
<div class="left">
<img src="../../images/404.png" alt="404">
</div>
<div class="right">
<h1>404</h1>
<p>抱歉,您访问的页面正在开发中,敬请期待…</p>
<button><a href="/">返回首页</a></button>
</div>
</div>
</div>
<body>
<script>
(function (window, document) {
var menu = document.getElementById('menu'),
WINDOW_CHANGE_EVENT = ('onorientationchange' in window) ? 'orientationchange' : 'resize';
function toggleHorizontal () {
[].forEach.call(
document.getElementById('menu').querySelectorAll('.custom-can-transform'),
function (el) {
el.classList.toggle('pure-menu-horizontal');
}
);
};
function toggleMenu () {
// set timeout so that the panel has a chance to roll up
// before the menu switches states
if (menu.classList.contains('open')) {
setTimeout(toggleHorizontal, 500);
} else {
toggleHorizontal();
}
menu.classList.toggle('open');
document.getElementById('toggle').classList.toggle('x');
};
function closeMenu () {
if (menu.classList.contains('open')) {
toggleMenu();
}
}
document.getElementById('toggle').addEventListener('click', function (e) {
toggleMenu();
e.preventDefault();
});
window.addEventListener(WINDOW_CHANGE_EVENT, closeMenu);
})(this, this.document);
</script>
</body>
</html>
\ No newline at end of file
/* eslint-disable */
import '../../common/css/com.less'
import './error.less'
import '../../common/css/grids-responsive-min.less'
\ No newline at end of file
html {
overflow-x: hidden;
}
body {
background-color: #eee;
}
.service-btn {
color: #F52500;
cursor: pointer;
}
.custom-wrapper {
background-color: #fff;
-webkit-font-smoothing: antialiased;
padding-top: 10px;
height: 60px;
padding-bottom: 10px;
overflow: hidden;
-webkit-transition: height 0.5s;
-moz-transition: height 0.5s;
-ms-transition: height 0.5s;
transition: height 0.5s;
.custom-brand {
display: flex;
.text {
height: 38px;
line-height: 38px;
margin-left: 20px;
padding-left: 10px;
border-left: 1px solid #E5E5E5;
}
}
.pure-menu-list {
li {
padding: 10px 0;
a {
height: 40px;
line-height: 40px;
margin: 0 2em;
padding: 0;
font-size: 16px;
color: #666;
&.active {
border-bottom: 2px solid #F52500;
}
&:hover {
background: none;
}
&:active {
background: none;
}
&:visited {
background: none;
}
&:link {
background: none;
}
}
}
}
}
.custom-wrapper.open {
height: 24em;
}
.custom-menu-3 {
text-align: right;
}
.custom-toggle {
width: 34px;
height: 34px;
position: absolute;
top: 24px;
right: 24px;
display: none;
}
.custom-toggle .bar {
background-color: #777;
display: block;
width: 20px;
height: 2px;
border-radius: 100px;
position: absolute;
top: 18px;
right: 7px;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
transition: all 0.5s;
}
.custom-toggle .bar:first-child {
-webkit-transform: translateY(-6px);
-moz-transform: translateY(-6px);
-ms-transform: translateY(-6px);
transform: translateY(-6px);
}
.custom-toggle.x .bar {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.custom-toggle.x .bar:first-child {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.logo {
width: 98px;
height: 38px;
}
.nav-wrap {
padding: 0 14em;
background-color: #fff;
}
.error-wrap {
display: flex;
align-items: center;
justify-content: center;
padding: 100px 0;
.left {
img {
pointer-events: none;
width: 80%;
}
}
.right {
h1 {
font-size: 100px;
color: #333;
font-weight: 600;
padding: 0;
margin: 0;
line-height: 140px;
}
p {
padding: 0;
margin: 0;
color: #999;
}
button {
width: 100px;
height: 35px;
margin-top: 20px;
border: 0;
outline: none;
font-size: 14px;
color: #FFFFFF;
text-align: center;
line-height: 14px;
background-image: linear-gradient(-90deg, #FE8702 0%, #F52500 100%);
box-shadow: 0 4px 14px 0 rgba(245,37,0,0.30);
border-radius: 2px;
a {
color: #fff;
text-decoration: none;
}
}
}
}
@media (max-width: 47.999em) {
.logo {
width: 60px;
height: 25px;
}
.custom-wrapper {
background: transparent;
height: 40px;
.custom-brand {
display: flex;
.text {
font-size: .8em;
height: 27px;
line-height: 27px;
margin-left: 20px;
padding-left: 10px;
border-left: 1px solid #E5E5E5;
}
}
}
.custom-toggle .bar {
top: 10px;
}
.banner-wrap {
margin-top: -80px;
}
.custom-menu-3 {
text-align: left;
}
.custom-toggle {
display: block;
}
.error-wrap {
flex-direction: column;
text-align: center;
.right {
h1 {
font-size: 2em;
line-height: 3em;
}
p {
margin-top: 1em;
padding: 0 1em;
font-size: 1em;
}
}
}
}
@media (max-width: 1800px) {
.nav-wrap {
padding: 0;
}
.detail-wrap {
padding: 0;
}
}
\ No newline at end of file
......@@ -16,11 +16,11 @@
<!<![endif]-->
<link rel="stylesheet" href="//unpkg.com/purecss@1.0.0/build/grids-responsive-min.css">
<script src="//cdn.bootcss.com/jquery/1.8.3/jquery.min.js"></script>
<script src="//cdn.bootcss.com/jquery-animateNumber/0.0.14/jquery.animateNumber.min.js"></script>
<!-- <script src="//cdn.bootcss.com/jquery-animateNumber/0.0.14/jquery.animateNumber.min.js"></script> -->
<script src="//images.vrm.cn/2019/07/03/wow.min.js"></script>
</head>
<body style="overflow-x: hidden;">
<body>
<div class="container">
<div class="nav-wrap">
<div class="custom-wrapper pure-g" id="menu">
......@@ -36,7 +36,7 @@
<div class="pure-u-1 pure-u-md-2-3">
<div class="pure-menu pure-menu-horizontal custom-menu-3 custom-can-transform">
<ul class="pure-menu-list">
<li class="pure-menu-item"><a href="#" class="pure-menu-link active">首页</a></li>
<li class="pure-menu-item"><a href="/" class="pure-menu-link active">首页</a></li>
<li class="pure-menu-item"><a href="#" class="pure-menu-link">产品服务</a></li>
<li class="pure-menu-item"><a href="#" class="pure-menu-link">融资攻略</a></li>
<li class="pure-menu-item"><a href="#" class="pure-menu-link">关于我们</a></li>
......@@ -56,7 +56,6 @@
<div class="form-inner">
<form action="" method="post" id="pc-create">
<p>30秒申请,最快3分钟极速放款</p>
<!-- <input type="text" id="loan" name="loan" placeholder="额度"> -->
<select id="loan" name="loan" value="">
<option disabled selected value="">额度</option>
<option value ="1万以下">1万以下</option>
......@@ -74,11 +73,10 @@
<option value="个体户">个体户</option>
<option value="其他">其他</option>
</select>
<!-- <input type="text" id="career" name="career" placeholder="职业"> -->
<input type="text" id="name" name="name" placeholder="姓名">
<input type="text" name="mobile" id="mobile" placeholder="手机">
<input type="text" id="name" name="name" maxlength="15" placeholder="姓名">
<input type="tel" name="mobile" id="mobile" maxlength="11" placeholder="手机">
<div class="agreed">
<input type="checkbox" name="agreed"><span class="text">我已阅读并同意<span class="service-btn">《服务协议》</span></span>
<input type="checkbox" name="agreed" id="checkbox"><span class="text"><label for="checkbox">我已阅读并同意</label><span class="service-btn"><a target="_blank" href="/serviceAgreement.html">《服务协议》</a></span><span class="service-btn"><a target="_blank" href="/privacyPolicy.html">《隐私政策》</a></span></span>
</div>
<button type="button" id="pc-apply">快速申请</button>
</form>
......@@ -100,30 +98,24 @@
</div>
<div class="input-wrap">
<span>姓名</span>
<input type="text" id="name" name="name" placeholder="请输入您的姓名">
<input type="text" id="name" name="name" maxlength="15" placeholder="请输入您的姓名">
</div>
<div class="input-wrap">
<span>手机</span>
<input type="text" name="mobile" id="mobile" placeholder="请输入您的手机号码">
<input type="tel" name="mobile" id="mobile" maxlength="11" placeholder="请输入您的手机号码">
</div>
<div class="agreed">
<input type="checkbox" name="agreed"><span class="text">我已阅读并同意<span class="service-btn">《服务协议》</span></span>
<input type="checkbox" name="agreed" id="checkbox"><span class="text"><label for="checkbox">我已阅读并同意</label><span class="service-btn"><a target="_blank" href="/serviceAgreement.html">《服务协议》</a></span><span class="service-btn"><a target="_blank" href="/privacyPolicy.html">《隐私政策》</a></span></span>
</div>
<button id="mobile-apply" type="button">快速申请</button>
</form>
</div>
<div class="num-wrap">
<div class="pc pure-g">
<div class="pure-u-1-2">
<div class="pure-u-1">
<div class="item left">
<span class="number member">1000000</span>
<p class="service-member">累计服务用户(人)</p>
</div>
</div>
<div class="pure-u-1-2">
<div class="item right">
<span class="number money">457730</span>
<p class="service-member">累计放款(元)</p>
<p class="service-member">累计服务用户数(人)</p>
<span class="number member numberRun2">1000000</span>
</div>
</div>
</div>
......@@ -131,12 +123,8 @@
<p class="title">实时交易数据</p>
<ul class="list">
<li class="item">
<span class="number member">1000000</span>
<p class="service-member wow fadeInLeft">累计服务用户(人)</p>
</li>
<li class="item">
<span class="number money">4577300</span>
<p class="service-member wow fadeInRight">累计放款(元)</p>
<span class="number member numberRun3">1000000</span>
<p class="service-member wow fadeInUp">累计服务用户数(人)</p>
</li>
</ul>
</div>
......@@ -177,7 +165,7 @@
<div class="wap">
<p class="title">更智能 更省心 更高效</p>
<div class="list">
<div class="item wow fadeInLeft">
<div class="item wow fadeInUp">
<div class="left">
<img src="../../images/circle_icon1_wap.png">
</div>
......@@ -187,7 +175,7 @@
<button type="button">免费体验</button>
</div>
</div>
<div class="item wow fadeInRight">
<div class="item wow fadeInUp">
<div class="left">
<img src="../../images/circle_icon2_wap.png">
</div>
......@@ -197,7 +185,7 @@
<button type="button">免费咨询</button>
</div>
</div>
<div class="item wow fadeInLeft">
<div class="item wow fadeInUp">
<div class="left">
<img src="../../images/circle_icon3_wap.png">
</div>
......@@ -306,7 +294,7 @@
<div class="about-wrap">
<div class="pc">
<div class="item left"></div>
<div class="item wow fadeInUp">
<div class="item right wow zoomIn">
<img class="logo" src="../../images/logo_fb_pc.png">
<div class="btn">一站式的融资服务平台</div>
<div class="text">高精准的智能推荐系统,知名银行及金融机构入驻,结合线下规模化、 专业化、标准化的融资服务团队,帮助资金供给双方实现精准、高效、低成本的业务连接,为资金需求方提供多种融资方案,加快融资响应速度,提高配对准确率。</div>
......@@ -334,7 +322,7 @@
</div>
<div class="content">
<p class="t-1">为了给您提供更好的服务,提升贷款成功率</p>
<p class="t-2">您可添加我们<span>专属融资顾问</span>微信体验一对一咨询服务<br />定制化融资方案,智能推荐快速匹配产品</pc>
<p class="t-2">您可添加我们<span>专属融资顾问</span>微信体验一对一咨询服务<br />定制化融资方案,智能推荐快速匹配产品</p>
<div class="qrcode-area">
<div class="qrcode">
<img class="qrcode-img" src="../../images/QR.jpg">
......@@ -354,6 +342,36 @@
<i class="close-bottom"></i>
</div>
</div>
<div class="wechat-click-wrap">
<div class="inner">
<i class="close"></i>
<div class="top">
<img src="../../images/tiyan-top.png">
<div class="t-content">
</div>
</div>
<div class="content">
<p class="t-1">亲,添加专属融资顾问微信体验</p>
<p class="t-2">一对一咨询服务,定制化融资方案,智能化产品推荐<br />赶快添加,了解详情吧~</p>
<div class="qrcode-area">
<div class="qrcode">
<img class="qrcode-img" src="../../images/QR.jpg">
</div>
<br />
<p class="scaner-text">打开微信 扫码添加</p>
<div class="mobile">
<p class="m-t1">添加方式1:</p>
<p class="m-t2">打开微信,添加【万金易融】<span class="copy-btn2" id="copyCode2">点我复制</span></p>
<textarea id="copy-value2" style="position: absolute;left: -9999px;top: -9999px;">123</textarea>
<button id="getCode2" style="position: absolute;left: -9988px;top: -9988px;" data-clipboard-target="#copy-value2">获取微信号</button>
<p class="m-t1">添加方式2:</p>
<p class="m-t2">长按保存图片 - 打开微信 - 扫一扫 - 选择“从相册选取二维码”</p>
</div>
</div>
</div>
<i class="close-bottom"></i>
</div>
</div>
<div class="copy-success">
<div class="inner">
<p class="t-1">恭喜您,复制成功</p>
......@@ -463,25 +481,182 @@
})
</script>
<script>
new WOW().init();
function toThousands (num) {
return (num || 0).toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,');
}
$('.member').animateNumber({
number: 1000000,
numberStep: function (now, tween) {
var target = $(tween.elem);
target.text(toThousands(Math.floor(now).toString()));
}
}, 1000);
$('.money').animateNumber({
number: 45773000,
numberStep: function (now, tween) {
var target = $(tween.elem);
target.text(toThousands(Math.floor(now).toString()));
}
}, 1000);
</script>
/**
* by Mantou qq:676015863
* 数字滚动插件 v1.0
*/
;(function ($) {
$.fn.numberAnimate = function (setting) {
var defaults = {
speed: 1000, // 动画速度
num: '', // 初始化值
iniAnimate: true, // 是否要初始化动画效果
symbol: '', // 默认的分割符号,千,万,千万
dot: 0 // 保留几位小数点
}
// 如果setting为空,就取default的值
var setting = $.extend(defaults, setting);
// 如果对象有多个,提示出错
if ($(this).length > 1) {
alert('just only one obj!');
return;
}
// 如果未设置初始化值。提示出错
if (setting.num == '') {
alert('must set a num!');
return;
}
var nHtml = '<div class="mt-number-animate-dom" data-num="{{num}}">\
<span class="mt-number-animate-span">0</span>\
<span class="mt-number-animate-span">1</span>\
<span class="mt-number-animate-span">2</span>\
<span class="mt-number-animate-span">3</span>\
<span class="mt-number-animate-span">4</span>\
<span class="mt-number-animate-span">5</span>\
<span class="mt-number-animate-span">6</span>\
<span class="mt-number-animate-span">7</span>\
<span class="mt-number-animate-span">8</span>\
<span class="mt-number-animate-span">9</span>\
<span class="mt-number-animate-span">.</span>\
</div>';
// 数字处理
var numToArr = function (num) {
num = parseFloat(num).toFixed(setting.dot);
if (typeof (num) === 'number') {
var arrStr = num.toString().split('');
} else {
var arrStr = num.split('');
}
// console.log(arrStr);
return arrStr;
}
// 设置DOM symbol:分割符号
var setNumDom = function (arrStr) {
var shtml = '<div class="mt-number-animate">';
for (var i = 0, len = arrStr.length; i < len; i++) {
if (i != 0 && (len - i) % 3 == 0 && setting.symbol != '' && arrStr[i] != '.') {
shtml += '<div class="mt-number-animate-dot">' + setting.symbol + '</div>' + nHtml.replace('{{num}}', arrStr[i]);
} else {
shtml += nHtml.replace('{{num}}', arrStr[i]);
}
}
shtml += '</div>';