Commit 22209d87 authored by liaili's avatar liaili

update

parent ef576e75
......@@ -153,14 +153,15 @@ dd {
#footer hr {
position: relative;
width: 940px;
background: #8c8c8c;
border: none;
border-bottom: 1px solid #8c8c8c;
margin: 0 auto;
}
#footer hr::after {
content: '';
display: block;
position: absolute;
top: -2px;
top: -1px;
left: 443px;
background: #8c8c8c;
width: 73px;
......@@ -467,16 +468,16 @@ dd {
}
.projects .projects-content .project-intro {
list-style: disc;
margin: 53px 0 100px 48px;
margin: 44px 0 79px 48px;
width: 400px;
padding: 79px 20px 20px 0;
padding: 42px 20px 2px 0;
border-right: 1px solid #7f7f7f;
font-size: 28px;
font-size: 23px;
color: #565656;
line-height: 40px;
line-height: 31px;
}
.projects .projects-content .project-intro li {
margin-bottom: 30px;
margin-bottom: 10px;
}
.projects .projects-content .computer {
position: absolute;
......@@ -973,13 +974,14 @@ dd {
height: 100%;
}
.hot-project-tabs {
width: 100%;
height: 690px;
background: #f6f6f6;
}
.hot-project-tabs ul {
width: 1203px;
height: 350px;
margin: 180px auto 160px;
}
.hot-project-tabs ul {
width: 100%;
height: 100%;
border: 1px solid #43abb6;
}
.hot-project-tabs ul li {
......@@ -987,7 +989,6 @@ dd {
height: 100%;
font-size: 16px;
color: #000;
background: #f6f6f6;
text-align: center;
}
.hot-project-tabs ul li dl {
......@@ -1061,12 +1062,12 @@ dd {
opacity: 0;
}
100% {
background: url("../imgs/hot_project/tabs04_a.png ") no-repeat;
background: url("../imgs/hot_project/tabs04_a.png ") no-repeat -1px -1px;
opacity: 1;
}
}
.hot-project-tabs ul li:nth-child(2):hover dt {
animation-name: changeOne;
animation-name: changeTwo;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
......@@ -1084,15 +1085,27 @@ dd {
}
}
.hot-project-tabs ul li:nth-child(3):hover dt {
animation-name: changeOne;
animation-name: changeThree;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
@-webkit-keyframes changeFour {
0% {
background: url("../imgs/hot_project/tabs02_b.png ") no-repeat;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
background: url("../imgs/hot_project/tabs02_a.png ") no-repeat;
}
}
.hot-project-tabs ul li:nth-child(4):hover dt {
animation-name: changeFour;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
body {
position: relative;
}
......
......@@ -122,14 +122,15 @@ h1, h2, h3, h4, h5, h6, ul, li, b, p, dl, dt, dd {
hr {
position: relative;
width: 940px;
background: #8c8c8c;
border: none;
border-bottom: 1px solid #8c8c8c;
margin: 0 auto;
}
hr::after {
content: '';
display: block;
position: absolute;
top: -2px;
top: -1px;
left: 443px;
background: #8c8c8c;
width: 73px;
......@@ -459,15 +460,15 @@ h1, h2, h3, h4, h5, h6, ul, li, b, p, dl, dt, dd {
.project-intro {
list-style: disc;
margin: 53px 0 100px 48px;
margin: 44px 0 79px 48px;
width: 400px;
padding: 79px 20px 20px 0;
padding: 42px 20px 2px 0;
border-right: 1px solid #7f7f7f;
font-size: 28px;
font-size: 23px;
color: #565656;
line-height: 40px;
line-height: 31px;
li {
margin-bottom: 30px;
margin-bottom: 10px;
}
}
.computer {
......@@ -987,19 +988,19 @@ h1, h2, h3, h4, h5, h6, ul, li, b, p, dl, dt, dd {
}
.hot-project-tabs {
width: 1203px;
height: 350px;
margin: 180px auto 160px;
width: 100%;
height: 690px;
background: #f6f6f6;
ul {
width: 100%;
height: 100%;
width: 1203px;
height: 350px;
margin:180px auto 160px;
border: 1px solid #43abb6;
li {
width: 300px;
height: 100%;
font-size: 16px;
color: #000;
background: #f6f6f6;
text-align: center;
dl {
width: 100%;
......@@ -1078,12 +1079,12 @@ h1, h2, h3, h4, h5, h6, ul, li, b, p, dl, dt, dd {
opacity: 0;
}
100% {
background: url("../imgs/hot_project/tabs04_a.png ") no-repeat;
background: url("../imgs/hot_project/tabs04_a.png ") no-repeat -1px -1px;
opacity: 1;
}
}
dt {
animation-name: changeOne;
animation-name: changeTwo;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
......@@ -1103,7 +1104,7 @@ h1, h2, h3, h4, h5, h6, ul, li, b, p, dl, dt, dd {
}
}
dt {
animation-name: changeOne;
animation-name: changeThree;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
......@@ -1111,11 +1112,20 @@ h1, h2, h3, h4, h5, h6, ul, li, b, p, dl, dt, dd {
li:nth-child(4):hover {
@-webkit-keyframes changeFour {
0% {
background: url("../imgs/hot_project/tabs02_b.png ") no-repeat;
}
50% {
opacity:0;
}
100% {
opacity: 1;
background: url("../imgs/hot_project/tabs02_a.png ") no-repeat;
}
}
dt {
animation-name: changeFour;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
}
}
......
......@@ -11,7 +11,7 @@
<!--暂时放在这里-->
<a href="index.html"><img src="../imgs/logo.png" alt="logo"></a>
<ul class="clear">
<li class="fl"><a href="index.html">首页 / PROJECT</a></li>
<li class="fl"><a href="index.html">首页 / HOME</a></li>
<li class="fl"><a href="product.html">项目合作 / PROJECT</a></li>
<li class="fl"><a href="hotProject.html">最新产品 / PRODUCT</a></li>
<li class="fl"><a href="aboutUs.html">关于我们 / ABOUT</a></li>
......
......@@ -11,7 +11,7 @@
<!--暂时放在这里-->
<a href="index.html"><img src="../imgs/logo.png" alt="logo"></a>
<ul class="clear">
<li class="fl"><a href="index.html">首页 / PROJECT</a></li>
<li class="fl"><a href="index.html">首页 / HOME</a></li>
<li class="fl"><a href="product.html">项目合作 / PROJECT</a></li>
<li class="fl"><a href="hotProject.html">最新产品 / PRODUCT</a></li>
<li class="fl"><a href="aboutUs.html">关于我们 / ABOUT</a></li>
......@@ -69,7 +69,7 @@
<textarea name="project-description" id="projectDescription" placeholder="详细写明您的项目需求 例如:项目时间、内容、合作意向。"></textarea>
</div>
<p class="error-description"></p>
<div><input type="button" value="立即提交" disabled id="submit"/></div>
<div><input type="submit" value="立即提交" disabled id="submit"/></div>
</form>
</div>
</div>
......@@ -82,7 +82,7 @@
</div>
</div>
<div class="hot-project-tabs">
<div class="hot-project-tabs clear">
<ul class="clear">
<li class="fl">
<dl>
......
......@@ -13,7 +13,7 @@
<!--暂时放在这里-->
<a href="index.html"><img src="../imgs/logo.png" alt="logo"></a>
<ul class="clear">
<li class="fl"><a href="index.html">首页 / PROJECT</a></li>
<li class="fl"><a href="index.html">首页 / HOME</a></li>
<li class="fl"><a href="product.html">项目合作 / PROJECT</a></li>
<li class="fl"><a href="hotProject.html">最新产品 / PRODUCT</a></li>
<li class="fl"><a href="aboutUs.html">关于我们 / ABOUT</a></li>
......@@ -119,18 +119,6 @@
<div class="projects-content">
<div>
<ul class="project-intro">
<li>
精选稀缺产品<br/>非区非县,市级资产端一手政信
</li>
<li>
尽享高额佣金<br/>远高市场佣金比例的返佣制度
</li>
<li>
完善风控体系<br/>原招商银行风控团队层层把关
</li>
<li>
佣金快速结算<br/>项目成立 T+0 ,帮您快速结佣
</li>
</ul>
<img src="../imgs/index/computer.jpg" class="computer"/>
</div>
......@@ -245,5 +233,7 @@
<p class="address">浙江省杭州市余杭区良睦路1299号互联网村5-305 E-mail: <a href="hr@shuniu.com">hr@shuniu.com</a></p>
<p class="copyright">Copyright2016 <span>shuniu</span> All Right Reserved&copy;2014-2015 杭州枢纽科技有限公司 版权所有</p>
</div>
<script src="../JS/jquery-1.8.3.min.js"></script>
<script src="../JS/index.js"></script>
</body>
</html>
\ No newline at end of file
......@@ -12,7 +12,7 @@
<!--暂时放在这里-->
<a href="index.html"><img src="../imgs/logo.png" alt="logo"></a>
<ul class="clear">
<li class="fl"><a href="index.html">首页 / PROJECT</a></li>
<li class="fl"><a href="index.html">首页 / HOME</a></li>
<li class="fl"><a href="product.html">项目合作 / PROJECT</a></li>
<li class="fl"><a href="hotProject.html">最新产品 / PRODUCT</a></li>
<li class="fl"><a href="aboutUs.html">关于我们 / ABOUT</a></li>
......@@ -68,8 +68,8 @@
<p>留下联系方式我们帮您第一时间抢占稀缺额度</p>
<form id="form">
<input type="text" name="userName" placeholder="请填写您的姓名" id="userName"/>
<input type="text" name="userTel" placeholder="请填写手机号" id="userTel"/>
<input type="button" id="submit" value="提交"/>
<input type="text" name="userTel" placeholder="请填写手机号" id="userTel" maxlength="11"/>
<input type="submit" id="submit" value="提交"/>
</form>
<p id="errorName" class="fl"></p>
<p id="errorTel" class="fl"></p>
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
* {margin: 0;padding: 0;font-family: Microsoft YaHei, simhei, Tahoma, Arial, sans-serif}
ul {list-style: none}
a {text-decoration: none}
.clear::after {
content: '';
display: block;
clear: both;
}
.clear::before {
content: '';
display: table;
}
.fl {float: left}
#header,#footer {width: 100%;}
#header {
height: 100px;
position: relative;
background: #939393;/*暂时*/
}
#header img {
position: absolute;
left:300px;
top:0;
z-index: 999;
}
#header ul {
margin-left:34.89%;
line-height: 100px;
font-size: 16px;
}
#header ul li {
margin-right: 44px;
}
#header ul li a {
color: #383838;
font-weight: bold;
}
#header ul li:hover a {
text-decoration: underline;
}
#footer {
height: 453px;
text-align: center;
background: #2e2e2e;/*暂时*/
margin-top: 600px; /*暂时*/
}
#footer .hotline {
font-size: 24px;
color: #fff;
margin-top: 58px;
}
#footer h4 {
font-size: 60px;
font-weight: bold;
color: #fff;
margin-bottom: 40px;
margin-top: 15px;
}
#footer div {
position: relative;
width: 940px;
height: 1px;
background: #8c8c8c;
margin: 0 auto;
}
#footer div span {
position:absolute ;
left:433px;
top:-1px;
width: 73px;
height: 3px;
background: #8c8c8c;
}
#footer .address {
margin-top: 60px;
color: #00a4d8;
font-size: 14px;
line-height: 26px;
}
#footer .copyright {
color: #aeaeae;
font-size: 14px;
line-height: 26px;
}
#footer .copyright span {
color: #fff;
}
</style>
</head>
<body>
<div id="header">
<a href="index.html"><img src="../imgs/logo.png" alt="logo"></a>
<ul class="clear">
<li class="fl"><a href="">首页 / PROJECT</a></li>
<li class="fl"><a href="">项目合作 / PROJECT</a></li>
<li class="fl"><a href="">最新产品 / PRODUCT</a></li>
<li class="fl"><a href="">关于我们 / ABOUT</a></li>
</ul>
</div>
<div id="footer" class="clear">
<p class="hotline">全国客服热线 9:30-18:30</p>
<h4>400-888-8888</h4>
<div><span></span></div>
<p class="address">浙江省杭州市余杭区良睦路1299号互联网村5-305 E-mail: <a href="hr@shuniu.com">hr@shuniu.com</a></p>
<p class="copyright">Copyright2016 <span>shuniu </span>All Right Reserved&copy;2014-2015 杭州枢纽科技有限公司 版权所有</p>
</div>
</body>
</html>
\ No newline at end of file
......@@ -8,6 +8,9 @@
var $introducerMobile = $('#introducerMobile');
var $projectDescription = $('#projectDescription');
var $modalBox = $('.modal_box');
var $introducer = $('#introducer');
/**
* 验证手机号
......@@ -15,9 +18,14 @@
* @returns {boolean}
*/
function valiTel(tel) {
var msg = /^[\d]{11}$/.test(tel) ? '' : '电话号码有误,请再次输入!';
$errorPhone.html(msg);
!msg && disableSubmit();
var msg = /^[\d]/g.test(tel) ? '' : '电话号码有误,请再次输入!';
//!msg && $introducerMobile.val('');
/^[\d]/g.test(tel[tel.length-1])? $introducerMobile.val(tel) : $introducerMobile.val(tel.slice(0,tel.length-1));
console.log(tel[tel.length-1]);
console.log(/^[\d]/g.test(tel[tel.length-1]));
!msg && $errorPhone.html(msg);
$errorPhone.data('vali', !msg);
disableSubmit();
return !msg;
}
......@@ -28,7 +36,8 @@
*/
function valiDescription(text) {
$errorDescription.html(text ? '' : '项目描述不能为空!');
text && disableSubmit();
$errorDescription.data('vali', text);
disableSubmit();
return !text;
}
......@@ -36,33 +45,37 @@
* 提交按钮是否可用
*/
function disableSubmit() {
$submit.attr('disabled') && $submit.attr('disabled', false).css('background', '#ff4a4b');
$errorPhone.data('vali') && $errorDescription.data('vali') &&
$submit.attr('disabled', false).css('background', '#ff4a4b');
}
$introducerMobile.on({
keyup: function (e) {
valiTel(($introducerMobile.val() + '').trim());
}
})
});
$projectDescription.on({
keyup: function (e) {
valiDescription(($projectDescription.val() + '').trim());
}
});
$('#introducer').on('submit', function (e) {
if (valiTel(($introducerMobile.val() + '').trim())) {
/*
* 不需要在再次验证
$introducer.on('submit', function (e) {
if (!valiTel(($introducerMobile.val() + '').trim())) {
$introducerMobile.focus();
$errorPhone.html('电话号码有误!');
e.preventDefault();
return;
}
if (valiDescription(($projectDescription.val() + '').trim())) {
$projectDescription.focus();
$errorDescription.html('项目描述不能为空!');
e.preventDefault();
return;
}
});
*/
/**
* 地图项目地址弹框
......
/**
* Created by liaili on 16/7/29.
*/
/**
* 动态添加project-intro的内容
*/
var textJson=[
['精选稀缺产品','非区非县,市级资产端一手政信'],
['尽享高额佣金','远高市场佣金比例的返佣制度'],
['完善风控体系','原招商银行风控团队层层把关'],
['佣金快速结算','项目成立 T+0 ,帮您快速结佣']
];
var lis=[];
var str='';
for( var i=0, len=textJson.length; i<len; i++){
lis.push(['<li>',textJson[i][0],'<br/>', textJson[i][1] ,'</li>'].join(''));
}
$('.project-intro').html(lis.join(''));
//$('.product-intro').html(textJson.map(item=>(`<li>${item[0]}<br/>${item[1]}</li>`)).join('')); ES6方法
......@@ -7,6 +7,7 @@
var $userName = $('#userName');
var $userTel = $('#userTel');
var $submit = $('#submit');
var $form=$('#form');
var myBalance = $('#myBalance').html();
var total = $('#total').html();
......@@ -32,7 +33,10 @@
* @returns {boolean}
*/
function valiMobile(mobile) {
var msg = /^[\d]{11}$/.test(mobile) ? '' : '手机号有误,请重新输入!';
var msg = /^[\d]/g.test(mobile) ? '' : '手机号有误,请重新输入!';
/^[\d]/g.test(mobile[mobile.length-1])? $userTel.val(mobile) : $userTel.val(mobile.slice(0,mobile.length-1));
console.log(mobile[mobile.length-1]);
console.log(/^[\d]/g.test(mobile[mobile.length-1]));
$errorTel.html(msg);
return !mobile;
}
......@@ -47,23 +51,20 @@
/**
* 提交验证
*/
$submit.on('click',function (e) {
$form.on('submit',function (e) {
if( valiUserName($.trim($userName.val()+'')) ){
$userName.focus();
e.preventDefault();
$errorName.html('用户名输入有误,请再次输入!');
return;
}else{
if( valiMobile( $.trim( $userTel.val()+'' ) ) ){
$userTel.focus();
e.preventDefault();
$errorTel.html('密码有误,请再次输入!');
return;
}else{
$("#form").submit;
console.log('ok');
}
}
if( valiMobile( $.trim( $userTel.val()+'' ) ) ){
$userTel.focus();
e.preventDefault();
$errorTel.html('密码有误,请再次输入!');
return;
}
});
......
imgs/hot_project/hot_project_banner.jpg

367 KB | W: | H:

imgs/hot_project/hot_project_banner.jpg

589 KB | W: | H:

imgs/hot_project/hot_project_banner.jpg
imgs/hot_project/hot_project_banner.jpg
imgs/hot_project/hot_project_banner.jpg
imgs/hot_project/hot_project_banner.jpg
  • 2-up
  • Swipe
  • Onion skin
imgs/hot_project/tabs04_a.png

5.69 KB | W: | H:

imgs/hot_project/tabs04_a.png

5.96 KB | W: | H:

imgs/hot_project/tabs04_a.png
imgs/hot_project/tabs04_a.png
imgs/hot_project/tabs04_a.png
imgs/hot_project/tabs04_a.png
  • 2-up
  • Swipe
  • Onion skin
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment