Skip to content

W
www.fudou6.com
Commit e4e7b55a authored by liaili's avatar liaili
Browse files
Options

9

parent 8c45dfd1
Show whitespace changes
Inline Side-by-side
Showing with 299 additions and 31 deletions
public/javascripts/product.js
View file @ e4e7b55a
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
var $userTel = $('input[name="userTel"]', $form); var $userTel = $('input[name="userTel"]', $form);
var $errorName = $('.appointment .errorName'); var $errorName = $('.appointment .errorName');
var $errorTel = $('.appointment .errorTel'); var $errorTel = $('.appointment .errorTel');
var $modalBox=$('.modal-box');
var balance = $('.balance').html(); var balance = $('.balance').html();
var total = $('.total').html(); var total = $('.total').html();
...@@ -69,8 +70,12 @@ ...@@ -69,8 +70,12 @@
$userTel.focus(); $userTel.focus();
return; return;
} }
console.log('ajax submit') $modalBox.show(500);
});
$('#modalBoxHidden').click(function (e) {
e.preventDefault();
$modalBox.hide(500);
}); });
......
public/javascripts/project.js
View file @ e4e7b55a
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
var $errorDescription = $('.error-description'); var $errorDescription = $('.error-description');
var $introducerMobile = $('#introducerMobile'); var $introducerMobile = $('#introducerMobile');
var $projectDescription = $('#projectDescription'); var $projectDescription = $('#projectDescription');
var $modalBox = $('.modal_box'); var $modalBox = $('.modal-box');
var $introducer = $('#introducer'); var $introducer = $('#introducer');
...@@ -80,13 +80,13 @@ ...@@ -80,13 +80,13 @@
/** /**
* 地图项目地址弹框 * 地图项目地址弹框
*/ */
$('.project_one').click(function (e) { $('.hot-project-address a').click(function (e) {
e.preventDefault(); e.preventDefault();
$modalBox.show(); $modalBox.show(500);
}); });
$('#modal_box_hidden').click(function (e) { $('#modalBoxHidden').click(function (e) {
e.preventDefault(); e.preventDefault();
$modalBox.hide(); $modalBox.hide(500);
}); });
......
public/stylesheets/product.css
View file @ e4e7b55a
...@@ -190,6 +190,78 @@ ...@@ -190,6 +190,78 @@
border-bottom: 0; border-bottom: 0;
} }
/*.product-info end*/ /*.product-info end*/
/* .modal-box start */
body {
position: relative;
}
.modal-box {
display: none;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.3);
z-index: 999;
position: fixed;
}
.modal-box .modal-dialog {
position: fixed;
left: 50%;
top: 50%;
margin-top: -200px;
margin-left: -300px;
width: 600px;
height: 400px;
background: #fff;
border-radius: 10px;
overflow: hidden;
}
.modal-box .modal-dialog div:nth-child(1) {
width: 100%;
height: 80px;
background: #ff4a4b;
position: relative;
}
.modal-box .modal-dialog div:nth-child(1) b {
display: inline-block;
width: 46px;
height: 46px;
line-height: 46px;
text-align: center;
border-radius: 50%;
border: 3px solid #fff;
font-size: 42px;
position: absolute;
right: 27px;
top: 15px;
cursor: pointer;
color: #fff;
}
.modal-box .modal-dialog div:nth-child(2) {
position: relative;
}
.modal-box .modal-dialog div:nth-child(2) i {
display: inline-block;
width: 69px;
height: 69px;
background: url(https://res.fudou6.com/c/4/20160730/e86YXBwb2ludG1lbnQtc3VjY2VzcyA=_69x69.png) no-repeat;
position: absolute;
left: 90px;
top: 8px;
}
.modal-box .modal-dialog div:nth-child(2) h3 {
font-size: 50px;
font-weight: bold;
color: #ff4a4a;
margin: 43px 0;
padding-left: 180px;
}
.modal-box .modal-dialog p {
font-size: 24px;
line-height: 28px;
text-align: center;
}
/* .modal-box end */
@media screen and (min-width: 769px) { @media screen and (min-width: 769px) {
body .intro, body .intro,
body .appointment, body .appointment,
......
public/stylesheets/product.less
View file @ e4e7b55a
...@@ -210,6 +210,85 @@ ...@@ -210,6 +210,85 @@
/*.product-info end*/ /*.product-info end*/
/* .modal-box start */
body {
position: relative;
}
.modal-box {
display: none;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.3);
z-index: 999;
position: fixed;
.modal-dialog {
position: fixed;
left: 50%;
top: 50%;
margin-top: -200px;
margin-left: -300px;
width: 600px;
height: 400px;
background: #fff;
border-radius: 10px;
overflow: hidden;
div {
&:nth-child(1){
width: 100%;
height: 80px;
background: #ff4a4b;
position: relative;
b {
display: inline-block;
width: 46px;
height: 46px;
line-height: 46px;
text-align: center;
border-radius: 50%;
border: 3px solid #fff;
font-size: 42px;
position: absolute;
right: 27px;
top: 15px;
cursor: pointer;
color: #fff;
}
}
&:nth-child(2){
position: relative;
i {
display: inline-block;
width: 69px;
height: 69px;
background: url(https://res.fudou6.com/c/4/20160730/e86YXBwb2ludG1lbnQtc3VjY2VzcyA=_69x69.png)no-repeat;
position: absolute;
left:90px;
top:8px;
}
h3 {
font-size: 50px;
font-weight: bold;
color: #ff4a4a;
margin: 43px 0;
padding-left:180px;
}
}
}
p {
font-size: 24px;
line-height: 28px;
text-align: center;
}
}
}
/* .modal-box end */
.screen() { .screen() {
.media(@screen-width-small, @container-width-small); .media(@screen-width-small, @container-width-small);
.media(@screen-width, @container-width); .media(@screen-width, @container-width);
......
public/stylesheets/project.css
View file @ e4e7b55a
...@@ -145,22 +145,23 @@ ...@@ -145,22 +145,23 @@
/* .hot-project-address start */ /* .hot-project-address start */
.hot-project-address { .hot-project-address {
width: 100%; width: 100%;
height: 926px;
background: #1272ac; background: #1272ac;
} }
.hot-project-address .hot-project-address-box { .hot-project-address .hot-project-address-box {
width: 1200px; width: 800px;
height: 100%; height: 100%;
margin: 0 auto; margin: 0 auto;
padding-top: 118px;
padding-bottom: 118px;
position: relative; position: relative;
} }
.hot-project-address .hot-project-address-box > div:nth-child(1) { .hot-project-address .hot-project-address-box > div:nth-child(1) {
position: absolute; position: absolute;
color: #fff; color: #fff;
top: 40px; top: 40px;
left: 20px; left: -60px;
} }
.hot-project-address .hot-project-address-box > div:nth-child(1) h4 { .hot-project-address .hot-project-address-box > div:nth-child(1) h2 {
font-size: 32px; font-size: 32px;
font-weight: bold; font-weight: bold;
line-height: 42px; line-height: 42px;
...@@ -171,7 +172,49 @@ ...@@ -171,7 +172,49 @@
} }
.hot-project-address .hot-project-address-box > div:nth-child(2) { .hot-project-address .hot-project-address-box > div:nth-child(2) {
width: 100%; width: 100%;
height: 100%; position: relative;
left: -80px;
}
.hot-project-address .hot-project-address-box > div:nth-child(2) img {
width: 100%;
}
.hot-project-address .hot-project-address-box > div:nth-child(2) a {
width: 138px;
height: 46px;
text-align: center;
line-height: 46px;
font-size: 18px;
font-weight: bold;
border-radius: 26px;
background: #fff;
color: #000;
position: absolute;
right: -144px;
z-index: 3;
}
.hot-project-address .hot-project-address-box > div:nth-child(2) a:nth-child(2) {
top: 3%;
}
.hot-project-address .hot-project-address-box > div:nth-child(2) a:nth-child(3) {
top: 23%;
}
.hot-project-address .hot-project-address-box > div:nth-child(2) a:nth-child(4) {
top: 38%;
}
.hot-project-address .hot-project-address-box > div:nth-child(2) a:nth-child(5) {
top: 56%;
}
.hot-project-address .hot-project-address-box > div:nth-child(2) a:nth-child(6) {
top: 65%;
}
.hot-project-address .hot-project-address-box > div:nth-child(2) a:nth-child(7) {
top: 74%;
}
.hot-project-address .hot-project-address-box > div:nth-child(2) a:nth-child(8) {
top: 84%;
}
.hot-project-address .hot-project-address-box > div:nth-child(2) a:nth-child(9) {
top: 94%;
} }
/* .hot-project-address end */ /* .hot-project-address end */
/* .hot-project-tabs start */ /* .hot-project-tabs start */
......
public/stylesheets/project.less
View file @ e4e7b55a
...@@ -230,19 +230,21 @@ ...@@ -230,19 +230,21 @@
.hot-project-address { .hot-project-address {
width: 100%; width: 100%;
height: 926px;
background: #1272ac; background: #1272ac;
.hot-project-address-box { .hot-project-address-box {
width: 1200px; width: 800px;
height: 100%; height: 100%;
margin: 0 auto; margin: 0 auto;
padding-top: 118px;
padding-bottom: 118px;
position: relative; position: relative;
> div:nth-child(1) { & > div {
&:nth-child(1) {
position: absolute; position: absolute;
color: #fff; color: #fff;
top: 40px; top: 40px;
left: 20px; left: -60px;
h4 { h2 {
font-size: 32px; font-size: 32px;
font-weight: bold; font-weight: bold;
line-height: 42px; line-height: 42px;
...@@ -252,9 +254,52 @@ ...@@ -252,9 +254,52 @@
line-height: 53px; line-height: 53px;
} }
} }
> div:nth-child(2) { &:nth-child(2){
width: 100%; width: 100%;
height: 100%; position: relative;
left:-80px;
img {
width: 100%;
}
a {
width: 138px;
height: 46px;
text-align: center;
line-height: 46px;
font-size: 18px;
font-weight: bold;
border-radius: 26px;
background: #fff;
color: #000;
position: absolute;
right:-144px;
z-index:3;
&:nth-child(2) {
top:3%;
}
&:nth-child(3) {
top:23%;
}
&:nth-child(4) {
top:38%;
}
&:nth-child(5) {
top:56%;
}
&:nth-child(6) {
top:65%;
}
&:nth-child(7) {
top:74%;
}
&:nth-child(8) {
top:84%;
}
&:nth-child(9) {
top:94%;
}
}
}
} }
} }
} }
......
views/product.hbs
View file @ e4e7b55a
...@@ -156,3 +156,17 @@ ...@@ -156,3 +156,17 @@
</tbody> </tbody>
</table> </table>
</div> </div>
<div class="modal-box">
<div class="modal-dialog">
<div>
<b id="modalBoxHidden">&times;</b>
</div>
<div>
<i></i>
<h3>恭喜你预约成功</h3>
</div>
<p>富豆工作人员将第一时间与您取得联系!</p>
</div>
</div>
\ No newline at end of file
views/project.hbs
View file @ e4e7b55a
...@@ -46,10 +46,20 @@ ...@@ -46,10 +46,20 @@
<div class="hot-project-address"> <div class="hot-project-address">
<div class="hot-project-address-box"> <div class="hot-project-address-box">
<div> <div>
<h4>热点项目</h4> <h2>热点项目</h2>
<p>※国内各地在进行项目分布图</p> <p>※国内各地在进行项目分布图</p>
</div> </div>
<div>
<img src="https://res.fudou6.com/c/4/20160730/g3zbWFw_1075x722.png" alt="map">
<a href="javascrpt:;">天津</a>
<a href="javascrpt:;">西安灞桥</a>
<a href="javascrpt:;">江苏海安</a>
<a href="javascrpt:;">成都金堂</a>
<a href="javascrpt:;">四川巴中</a>
<a href="javascrpt:;">贵州同仁</a>
<a href="javascrpt:;">贵州余庆</a>
<a href="javascrpt:;">贵州南州</a>
</div>
</div> </div>
</div> </div>
<div class="hot-project-tabs clear"> <div class="hot-project-tabs clear">
......
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