Commit a2fcbf23 by Sweet Zhang

增加客服

parent 6feb56b8
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$">
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
<excludeFolder url="file://$MODULE_DIR$/temp" />
<excludeFolder url="file://$MODULE_DIR$/tmp" />
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>
\ No newline at end of file
<component name="InspectionProjectProfileManager">
<profile version="1.0">
<option name="myName" value="Project Default" />
</profile>
</component>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="JsFlowSettings">
<service-enabled>false</service-enabled>
<exe-path />
<annotation-enable>false</annotation-enable>
<other-services-enabled>false</other-services-enabled>
</component>
<component name="ProjectInspectionProfilesVisibleTreeState">
<entry key="Project Default">
<profile-state>
<expanded-state>
<State>
<id />
</State>
</expanded-state>
<selected-state>
<State>
<id>TypeScript</id>
</State>
</selected-state>
</profile-state>
</entry>
</component>
</project>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/.idea/ci-campaign.iml" filepath="$PROJECT_DIR$/.idea/ci-campaign.iml" />
</modules>
</component>
</project>
\ No newline at end of file
*{padding: 0;margin: 0;color:#333;font-family: '微软雅黑';-webkit-box-sizing: border-box; * {
padding: 0;
margin: 0;
color: #333;
font-family: '微软雅黑';
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
box-sizing: border-box;} box-sizing: border-box;
ul,ol{ }
ul, ol {
list-style: none; list-style: none;
} }
a{
color:#333; a {
color: #333;
display: block; display: block;
text-decoration: none; text-decoration: none;
} }
a:link{
text-decoration:none; a:link {
text-decoration: none;
} }
img{display:block;border:0;max-width: 100%;}
html,body{ img {
width:100%; display: block;
height:100%; border: 0;
max-width: 100%;
}
html, body {
width: 100%;
height: 100%;
min-width: 320px; min-width: 320px;
max-width: 640px; max-width: 640px;
margin:0 auto; margin: 0 auto;
font-size: 16px; font-size: 16px;
} }
.banner{
margin:0 auto; .banner {
margin: 0 auto;
} }
.btn1,.orderBtn,.testBtn{
.btn1, .orderBtn, .testBtn {
width: 70%; width: 70%;
margin: 0 auto; margin: 0 auto;
} }
.btn1{
margin:20px auto; .btn1 {
margin: 20px auto;
} }
.wrapper{
.wrapper {
padding-right: 15px; padding-right: 15px;
padding-left: 15px; padding-left: 15px;
margin-right: auto; margin-right: auto;
margin-left: auto; margin-left: auto;
} }
.wrapper section{
.wrapper section {
float: left; float: left;
width: 100%; width: 100%;
padding: 0 5%; padding: 0 5%;
} }
.wrapper section label { .wrapper section label {
width: 30%; width: 30%;
float: left; float: left;
} }
.form-control,.wrapper section .item{ .form-control, .wrapper section .item {
float: left; float: left;
width: 70%; width: 70%;
height: 34px; height: 34px;
line-height: 34px; line-height: 34px;
} }
.wrapper section .item .icon{
.wrapper section .item .icon {
margin-right: 5%; margin-right: 5%;
} }
.item .sex_item{
.item .sex_item {
float: left; float: left;
width: 30%; width: 30%;
margin-right: 10%; margin-right: 10%;
} }
.wrapper section .tips{
.wrapper section .tips {
float: right; float: right;
width: 70%; width: 70%;
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
color:#f81e06; color: #f81e06;
font-size: 12px; font-size: 12px;
} }
.agree{
.agree {
font-size: 12px; font-size: 12px;
width: 100%; width: 100%;
height:25px; height: 25px;
line-height:25px; line-height: 25px;
position: relative; position: relative;
} }
.agree span{
.agree span {
display: inline-block; display: inline-block;
position: absolute; position: absolute;
} }
.agree span b{
font-weight:normal; .agree span b {
color:#8a8a8a; font-weight: normal;
color: #8a8a8a;
} }
.content{
.content {
position: relative; position: relative;
width: 100%; width: 100%;
margin:0 auto; margin: 0 auto;
} }
.content #orderBtn,.content #btn3{
.content #orderBtn, .content #btn3 {
position: absolute; position: absolute;
width: 70%; width: 70%;
left: 15%; left: 15%;
} }
.content #orderBtn { .content #orderBtn {
top: 66.5%; top: 66.5%;
} }
.content #btn3 { .content #btn3 {
top: 83%; top: 83%;
} }
footer{
footer {
width: 100%; width: 100%;
position: relative; position: relative;
bottom:0; bottom: 0;
background: #fff; background: #fff;
min-width: 320px; min-width: 320px;
max-width: 640px; max-width: 640px;
margin: 0 auto; margin: 0 auto;
} }
footer ul{
footer ul {
width: 100%; width: 100%;
border-top:1px #d1d1d1 solid; border-top: 1px #d1d1d1 solid;
} }
footer ul li{
footer ul li {
width: 50%; width: 50%;
float: left; float: left;
height:45px; height: 45px;
line-height:45px; line-height: 45px;
text-align: center; text-align: center;
border-right:1px #d1d1d1 solid; border-right: 1px #d1d1d1 solid;
} }
footer ul li:nth-child(2){
border-right:none; footer ul li:nth-child(2) {
border-right: none;
} }
footer ul li.selected{
footer ul li.selected {
background: #fc6351; background: #fc6351;
color: #fff; color: #fff;
} }
/* .toast{ /* .toast{
display: none; display: none;
width: 100%; width: 100%;
...@@ -157,31 +194,34 @@ footer ul li.selected{ ...@@ -157,31 +194,34 @@ footer ul li.selected{
height:80px; height:80px;
line-height:80px; line-height:80px;
}*/ }*/
.layui-m-layercont{ .layui-m-layercont {
position: relative!important; position: relative !important;
padding:0!important; padding: 0 !important;
text-align: center!important; text-align: center !important;
width: 100%!important; width: 100% !important;
height: 105px!important; height: 105px !important;
line-height: 105px!important; line-height: 105px !important;
} }
.totast_content{
.totast_content {
width: 100%; width: 100%;
text-align: center; text-align: center;
margin: 0 auto; margin: 0 auto;
height:130px; height: 130px;
position: relative; position: relative;
} }
.totast_content .iconfont{
.totast_content .iconfont {
width: 60px; width: 60px;
height: 60px; height: 60px;
font-size: 60px; font-size: 60px;
position: relative; position: relative;
top: 5px; top: 5px;
left: 40%; left: 40%;
line-height:60px; line-height: 60px;
} }
.callBtn{
.callBtn {
width: 60px; width: 60px;
text-align: center; text-align: center;
position: relative; position: relative;
...@@ -189,13 +229,36 @@ footer ul li.selected{ ...@@ -189,13 +229,36 @@ footer ul li.selected{
top: 4%; top: 4%;
height: 40px; height: 40px;
line-height: 40px; line-height: 40px;
} }
.layui-m-layercont .service_item{
.layui-m-layercont .service_item {
margin-top: 10%; margin-top: 10%;
} }
.layui-m-layercont p.service{
height:30px; .layui-m-layercont p.service {
line-height:30px; height: 30px;
line-height: 30px;
}
#compaignCS .csBox-init {
position: fixed;
top: 65%;
right: 1rem;
z-index: 1000;
width: 3.8rem;
height: 3.8rem;
transition: .2s;
background: url('https://p.qpic.cn/qidian_pic/2852152378/20190301581fc07351cb9ad81487d8362531b1f5/0') center/cover no-repeat;
} }
#compaignCS .csBox-init-actived {
position: fixed;
top: 65%;
right: -1.9rem;
z-index: 1000;
width: 3.8rem;
height: 3.8rem;
transition: .2s;
background: url('https://p.qpic.cn/qidian_pic/2852152378/20190301581fc07351cb9ad81487d8362531b1f5/0') center/cover no-repeat;
}
\ No newline at end of file
...@@ -135,6 +135,11 @@ footer{ ...@@ -135,6 +135,11 @@ footer{
height:30px; height:30px;
line-height:30px; line-height:30px;
} }
#compaignCS .csBox-init {
width: 0;
height: 0;
}
@media screen and (max-width: 1400px){ @media screen and (max-width: 1400px){
html,body{ html,body{
font-size:12px; font-size:12px;
......
...@@ -7,89 +7,93 @@ ...@@ -7,89 +7,93 @@
<link rel="stylesheet" href="css/bootstrap.min.css"> <link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/iconfont.css"> <link rel="stylesheet" href="css/iconfont.css">
<!-- <link rel="stylesheet" href="css/style.css"> --> <!-- <link rel="stylesheet" href="css/style.css"> -->
<link rel="shortcut icon" href="https://www.ydinsurance.cn/wp-content/uploads/2018/04/favicon.gif" /> <link rel="shortcut icon" href="https://www.ydinsurance.cn/wp-content/uploads/2018/04/favicon.gif"/>
<link rel="stylesheet" href="css/mstyle.css">
<title>重疾险,大病保险-最惠比</title> <title>重疾险,大病保险-最惠比</title>
<meta name="keywords" content="重疾险,重疾险排名,重疾险哪家好" /> <meta name="keywords" content="重疾险,重疾险排名,重疾险哪家好"/>
<meta name="description" content="2018畅销款重大疾病保险,保障范围100种重疾.30种轻症,保额50万。" /> <meta name="description" content="2018畅销款重大疾病保险,保障范围100种重疾.30种轻症,保额50万。"/>
</head> </head>
<body> <body>
<div class="banner"> <div class="banner">
<img class="pbanner" src="images/banner.jpg" alt="banner" /> <img class="pbanner" src="images/banner.jpg" alt="banner"/>
<section class="wrapper"> <section class="wrapper">
<img class="btn1" src="images/btn1.png" /> <img class="btn1" src="images/btn1.png"/>
<section> <section>
<label>性别:</label> <label>性别:</label>
<div class="item"> <div class="item">
<div class="sex_item"><span class="icon iconfont male on">&#xe684;</span></div> <div class="sex_item"><span class="icon iconfont male on">&#xe684;</span></div>
<div class="sex_item"><span class="icon iconfont female">&#xe664;</span></div> <div class="sex_item"><span class="icon iconfont female">&#xe664;</span></div>
</div> </div>
<div class="sexTips tips"></div> <div class="sexTips tips"></div>
</section> </section>
<section> <section>
<label>保障金额:</label> <label>保障金额:</label>
<select class="form-control" id="choseMoney"> <select class="form-control" id="choseMoney">
<option value="1">10万</option> <option value="1">10万</option>
<option value="2">20万</option> <option value="2">20万</option>
<option value="3">30万</option> <option value="3">30万</option>
<option value="4">40万</option> <option value="4">40万</option>
<option value="5">50万</option> <option value="5">50万</option>
</select> </select>
<div class="moneyTips tips"></div> <div class="moneyTips tips"></div>
</section> </section>
<section> <section>
<label>姓名:</label> <label>姓名:</label>
<input class="form-control username" type="text" placeholder="请输入您的姓名"> <input class="form-control username" type="text" placeholder="请输入您的姓名">
<div class="nameTips tips"></div> <div class="nameTips tips"></div>
</section> </section>
<section> <section>
<label>手机号码:</label> <label>手机号码:</label>
<input class="form-control userphone" type="text" placeholder="请输入您的手机号码"> <input class="form-control userphone" type="text" placeholder="请输入您的手机号码">
<div class="phoneTips tips"></div> <div class="phoneTips tips"></div>
</section> </section>
<section> <section>
<img class="testBtn" src="images/btn3.png" alt="保费试算"> <img class="testBtn" src="images/btn3.png" alt="保费试算">
</section> </section>
<section class="last_item"> <section class="last_item">
<div class="agree"> <div class="agree">
<span><i class="iconfont on">&#xe504;</i> <b>本人同意最惠比联系本人进行精准报价和产品介绍 </b></span> <span><i class="iconfont on">&#xe504;</i> <b>本人同意最惠比联系本人进行精准报价和产品介绍 </b></span>
</div>
<div class="agreeTips tips"></div>
</section>
</section>
<img class="bottom" src="images/bottom.png">
</div>
<section class="content">
<img class="bg" src="images/bg.jpg" />
<img id="orderBtn" src="images/btn2.png" alt="预约保险顾问">
<img id="btn3" src="images/btn2.png" alt="预约保险顾问">
</section>
<footer>
<ul class="tab">
<li id="askBtn">电话咨询</li>
<li class="jump">保费试算</li>
</ul>
</footer>
<!-- <div class="toast">
<div class="toast_wrapper">
<h2 class="title">400-921-9290</h2>
<div class="totast_content">
<span class="iconfont">&#xe6bb;</span>
<a class="callBtn" href="tel:+400-921-9290">拨打电话</a>
</div> </div>
<div class="agreeTips tips"></div>
</section>
</section>
<img class="bottom" src="images/bottom.png">
</div>
<section class="content">
<img class="bg" src="images/bg.jpg"/>
<img id="orderBtn" src="images/btn2.png" alt="预约保险顾问">
<img id="btn3" src="images/btn2.png" alt="预约保险顾问">
</section>
<footer>
<ul class="tab">
<li id="askBtn">电话咨询</li>
<li class="jump">保费试算</li>
</ul>
</footer>
<div id="compaignCS">
<div class="csBox-init"></div>
</div>
<!-- <div class="toast">
<div class="toast_wrapper">
<h2 class="title">400-921-9290</h2>
<div class="totast_content">
<span class="iconfont">&#xe6bb;</span>
<a class="callBtn" href="tel:+400-921-9290">拨打电话</a>
</div> </div>
</div> --> </div>
<script src="js/jquery.min.js"></script> </div> -->
<script src="js/bootstrap.min.js"></script> <script src="js/jquery.min.js"></script>
<script src="js/layer.js"></script> <script src="js/bootstrap.min.js"></script>
<script src="js/base.js"></script> <script src="js/layer.js"></script>
<script> <script src="js/base.js"></script>
var _hmt = _hmt || []; <script>
(function() { var _hmt = _hmt || [];
var hm = document.createElement("script"); (function () {
hm.src = "https://hm.baidu.com/hm.js?36b1eb7eec3b5dac9f97d887092b5b27"; var hm = document.createElement("script");
var s = document.getElementsByTagName("script")[0]; hm.src = "https://hm.baidu.com/hm.js?36b1eb7eec3b5dac9f97d887092b5b27";
s.parentNode.insertBefore(hm, s); var s = document.getElementsByTagName("script")[0];
})(); s.parentNode.insertBefore(hm, s);
</script> })();
</script>
</body> </body>
</html> </html>
\ No newline at end of file
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