Skip to content

A
allCampaign
Commit fecfa5b1 by Sweet Zhang
Options

20203月妈咪宝贝线上推广

parent dbe07d3a
Showing with 259 additions and 0 deletions
yd-children-overall/css/bootstrap.min.css 0 → 100644
This source diff could not be displayed because it is too large. You can view the blob instead.
yd-children-overall/css/style.css 0 → 100644
ul, li {
list-style: none;
padding: 0;
margin: 0;
}
html, body {
width: 100%;
height: 100%;
font-size: 14px;
}
.container {
position: relative;
padding: 0;
max-width: 640px;
min-width: 320px;
margin: 0 auto;
}
.formInfo {
background-color: #fff;
text-align: center;
padding: 8% 4% 4% 3%;
border-radius: 12px;
position: absolute;
left: 0;
right: 0;
top: 17%;
margin: 7% 4% 0;
box-shadow: 0px 0px 8px 0 rgba(96, 96, 96, 0.25);
}
.formInfo input {
width: 100%;
height: 30px;
border: 1px solid #dbdbdb;
padding-left: 15px;
border-radius: 3px;
box-sizing: content-box;
}
.formInfo > h5 {
font-size: 1.5em;
color: #ff6125;
font-weight: bold;
margin-top: 0;
}
.formInfo > ul > li {
height: 50px;
line-height: 50px;
display: flex;
justify-content: space-between;
border-bottom: 1px solid #dcdcdc;
}
.formInfo > ul > li > div:first-child {
color: #333;
width: 60px;
white-space: nowrap;
font-size: 15px;
}
.formInfo > ul > li > div:last-child {
flex: 1;
padding-left: 20px;
display: flex;
align-items: center;
}
.formInfo > ul > li:nth-of-type(4), .formInfo > ul > li:nth-of-type(5) {
border: none;
}
.formInfo > ul > li .actived {
background-color: #ff6125;
color: #fff !important;
}
.immediateMeasurement {
height: 50px;
line-height: 50px;
text-align: center;
font-size: 24px;
letter-spacing: 2px;
background: linear-gradient(to bottom, #fc7700, #f85326);
color: #fff;
border-radius: 25px;
box-shadow: 0 3px 3px 0px rgba(118, 118, 118, 0.42);
margin-bottom: 23px;
}
.dialog {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
z-index: 2;
display: none;
}
.dialog .content {
background: #fff;
position: absolute;
top: 10%;
left: 15px;
right: 15px;
padding: 30px 15px;
border-radius: 6px;
}
.dialog .closeContainer {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 46%;
left: 0;
right: 0;
}
.dialog .closeBtn {
border: 1px solid #fff;
border-radius: 50%;
width: 50px;
height: 50px;
color: #fff;
font-size: 22px;
display: flex;
justify-content: center;
align-items: center;
}
@media (max-width: 320px) {
.formInfo > ul > li {
height: 40px;
line-height: 40px;
}
.formInfo input {
height: 24px;
}
.immediateMeasurement {
height: 40px;
line-height: 40px;
font-size: 20px;
}
}
\ No newline at end of file
yd-children-overall/index.html 0 → 100644
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
<title>银盾保险在线</title>
<link rel="stylesheet" href="./css/bootstrap.min.css">
<link rel="stylesheet" href="./css/style.css">
<link rel="shortcut icon" href="https://www.ydinsurance.cn/wp-content/uploads/2018/04/favicon.gif"/>
<script>
var _hmt = _hmt || [];
(function () {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?36b1eb7eec3b5dac9f97d887092b5b27";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
</head>
<body>
<div class="container">
<img src="./images/bg.jpg" alt="" class="img-responsive">
<div class="formInfo">
<h5>全能少儿保险费预测</h5>
<div style="position: relative;height: 22px;margin-bottom: 10px;">
<div style="position: absolute;left: 0;right: 0;z-index: 1;font-size: 1em;color: #fea454;letter-spacing: 1px">
每一份保险，都是为父母的关爱添砖加瓦
</div>
<div style="position: absolute;bottom: 0;height: 7px;left: 0;right: 0;background:#ffe9d6;border-radius: 3px"></div>
</div>
<ul>
<li>
<div>出生日期</div>
<div>
<input type="date" id="babyBirth">
</div>
</li>
<li>
<div>宝宝性别</div>
<div style="display: flex;align-items: center">
<div style="width:72px;height:30px;line-height: 30px;text-align: center;border-radius: 3px;border:1px solid #dbdbdb;color:#999;margin-right:10px;" class="babyGender" data-attr="男">
男
</div>
<div style="width:72px;height:30px;line-height: 30px;text-align: center;border-radius: 3px;border:1px solid #dbdbdb;color:#999" class="babyGender" data-attr="女">
女
</div>
</div>
</li>
<li>
<div>您的姓名</div>
<div>
<input type="text" placeholder="请输入您的姓名" id="name">
</div>
</li>
<li>
<div>手机号码</div>
<div>
<input type="text" placeholder="用于接收保费预测结果" id="phone">
</div>
</li>
<li>
<div style="visibility: hidden">输验证码</div>
<div style="position: relative;margin-top:-15px;">
<input type="tel" placeholder="输入验证码" style="margin-right: 10px;width: calc(100% - 90px);" id="code">
<button style="width:67px;font-size:12px;border-radius:3px;background:rgb(255,97,37);color:#fff;padding:0 5px;height:30px;line-height: 30px;box-sizing: content-box;border: none;" id="codeBtn">
获取验证码
</button>
</div>
</li>
</ul>
<div class="immediateMeasurement">
<span id="goMeasurement">立即测算</span>
</div>
<div style="color:#ccc;text-align: justify;font-size: 11px;">
安全声明：您的信息将被严格保密,您提供的个人信息授权仅用于本次给您测算保费,我们不会泄露给任何第三方或其他用途。
</div>
</div>
<!--弹窗START-->
<div class="dialog">
<div class="content">
<div class="icon"></div>
<div>专业儿童保险规划师将在1个工作日内为您致电服务和微信联系，请您留意接听电话机微信添加好友信息。</div>
<div class="eqrcode"></div>
<div>关注“银盾保险在线”公众号，更多热销产品抢先了解。</div>
</div>
<div class="closeContainer"><span class="closeBtn">X</span></div>
</div>
<!--弹窗END-->
</div>
<script src="https://res2.wx.qq.com/open/js/jweixin-1.4.0.js "></script>
<script src="./js/jquery.min.js"></script>
<script src="./js/layer.js"></script>
<script src="./js/base.js"></script>
</body>
</html>
\ No newline at end of file
yd-children-overall/js/layer.js 0 → 100644
/*! layer mobile-v2.0 弹层组件移动版 License LGPL http://layer.layui.com/mobile By 贤心 */
;!function(a){"use strict";var b=document,c="querySelectorAll",d="getElementsByClassName",e=function(a){return b[c](a)},f={type:0,shade:!0,shadeClose:!0,fixed:!0,anim:"scale"},g={extend:function(a){var b=JSON.parse(JSON.stringify(f));for(var c in a)b[c]=a[c];return b},timer:{},end:{}};g.touch=function(a,b){a.addEventListener("click",function(a){b.call(this,a)},!1)};var h=0,i=["layui-m-layer"],j=function(a){var b=this;b.config=g.extend(a),b.view()};j.prototype.view=function(){var a=this,c=a.config,f=b.createElement("div");a.id=f.id=i[0]+h,f.setAttribute("class",i[0]+" "+i[0]+(c.type||0)),f.setAttribute("index",h);var g=function(){var a="object"==typeof c.title;return c.title?'<h3 style="'+(a?c.title[1]:"")+'">'+(a?c.title[0]:c.title)+"</h3>":""}(),j=function(){"string"==typeof c.btn&&(c.btn=[c.btn]);var a,b=(c.btn||[]).length;return 0!==b&&c.btn?(a='<span yes type="1">'+c.btn[0]+"</span>",2===b&&(a='<span no type="0">'+c.btn[1]+"</span>"+a),'<div class="layui-m-layerbtn">'+a+"</div>"):""}();if(c.fixed||(c.top=c.hasOwnProperty("top")?c.top:100,c.style=c.style||"",c.style+=" top:"+(b.body.scrollTop+c.top)+"px"),2===c.type&&(c.content='<i></i><i class="layui-m-layerload"></i><i></i><p>'+(c.content||"")+"</p>"),c.skin&&(c.anim="up"),"msg"===c.skin&&(c.shade=!1),f.innerHTML=(c.shade?"<div "+("string"==typeof c.shade?'style="'+c.shade+'"':"")+' class="layui-m-layershade"></div>':"")+'<div class="layui-m-layermain" '+(c.fixed?"":'style="position:static;"')+'><div class="layui-m-layersection"><div class="layui-m-layerchild '+(c.skin?"layui-m-layer-"+c.skin+" ":"")+(c.className?c.className:"")+" "+(c.anim?"layui-m-anim-"+c.anim:"")+'" '+(c.style?'style="'+c.style+'"':"")+">"+g+'<div class="layui-m-layercont">'+c.content+"</div>"+j+"</div></div></div>",!c.type||2===c.type){var k=b[d](i[0]+c.type),l=k.length;l>=1&&layer.close(k[0].getAttribute("index"))}document.body.appendChild(f);var m=a.elem=e("#"+a.id)[0];c.success&&c.success(m),a.index=h++,a.action(c,m)},j.prototype.action=function(a,b){var c=this;a.time&&(g.timer[c.index]=setTimeout(function(){layer.close(c.index)},1e3*a.time));var e=function(){var b=this.getAttribute("type");0==b?(a.no&&a.no(),layer.close(c.index)):a.yes?a.yes(c.index):layer.close(c.index)};if(a.btn)for(var f=b[d]("layui-m-layerbtn")[0].children,h=f.length,i=0;h>i;i++)g.touch(f[i],e);if(a.shade&&a.shadeClose){var j=b[d]("layui-m-layershade")[0];g.touch(j,function(){layer.close(c.index,a.end)})}a.end&&(g.end[c.index]=a.end)},a.layer={v:"2.0",index:h,open:function(a){var b=new j(a||{});return b.index},close:function(a){var c=e("#"+i[0]+a)[0];c&&(c.innerHTML="",b.body.removeChild(c),clearTimeout(g.timer[a]),delete g.timer[a],"function"==typeof g.end[a]&&g.end[a](),delete g.end[a])},closeAll:function(){for(var a=b[d](i[0]),c=0,e=a.length;e>c;c++)layer.close(0|a[0].getAttribute("index"))}},"function"==typeof define?define(function(){return layer}):function(){var a=document.scripts,c=a[a.length-1],d=c.src,e=d.substring(0,d.lastIndexOf("/")+1);c.getAttribute("merge")||document.head.appendChild(function(){var a=b.createElement("link");return a.href=e+"need/layer.css?2.0",a.type="text/css",a.rel="styleSheet",a.id="layermcss",a}())}()}(window);
\ No newline at end of file
yd-children-overall/js/need/layer.css 0 → 100644
.layui-m-layer{position:relative;z-index:19891014}.layui-m-layer *{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.layui-m-layermain,.layui-m-layershade{position:fixed;left:0;top:0;width:100%;height:100%}.layui-m-layershade{background-color:rgba(0,0,0,.7);pointer-events:auto}.layui-m-layermain{display:table;font-family:Helvetica,arial,sans-serif;pointer-events:none}.layui-m-layermain .layui-m-layersection{display:table-cell;vertical-align:middle;text-align:center}.layui-m-layerchild{position:relative;display:inline-block;text-align:left;background-color:#fff;font-size:14px;border-radius:5px;box-shadow:0 0 8px rgba(0,0,0,.1);pointer-events:auto;-webkit-overflow-scrolling:touch;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:.2s;animation-duration:.2s}@-webkit-keyframes layui-m-anim-scale{0%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes layui-m-anim-scale{0%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}.layui-m-anim-scale{animation-name:layui-m-anim-scale;-webkit-animation-name:layui-m-anim-scale}@-webkit-keyframes layui-m-anim-up{0%{opacity:0;-webkit-transform:translateY(800px);transform:translateY(800px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes layui-m-anim-up{0%{opacity:0;-webkit-transform:translateY(800px);transform:translateY(800px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.layui-m-anim-up{-webkit-animation-name:layui-m-anim-up;animation-name:layui-m-anim-up}.layui-m-layer0 .layui-m-layerchild{width:90%;max-width:640px}.layui-m-layer1 .layui-m-layerchild{border:none;border-radius:0}.layui-m-layer2 .layui-m-layerchild{width:auto;max-width:260px;min-width:40px;border:none;background:0 0;box-shadow:none;color:#fff}.layui-m-layerchild h3{padding:0 10px;height:60px;line-height:60px;font-size:16px;font-weight:400;border-radius:5px 5px 0 0;text-align:center}.layui-m-layerbtn span,.layui-m-layerchild h3{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.layui-m-layercont{padding:50px 30px;line-height:22px;text-align:center}.layui-m-layer1 .layui-m-layercont{padding:0;text-align:left}.layui-m-layer2 .layui-m-layercont{text-align:center;padding:0;line-height:0}.layui-m-layer2 .layui-m-layercont i{width:25px;height:25px;margin-left:8px;display:inline-block;background-color:#fff;border-radius:100%;-webkit-animation:layui-m-anim-loading 1.4s infinite ease-in-out;animation:layui-m-anim-loading 1.4s infinite ease-in-out;-webkit-animation-fill-mode:both;animation-fill-mode:both}.layui-m-layerbtn,.layui-m-layerbtn span{position:relative;text-align:center;border-radius:0 0 5px 5px}.layui-m-layer2 .layui-m-layercont p{margin-top:20px}@-webkit-keyframes layui-m-anim-loading{0%,100%,80%{transform:scale(0);-webkit-transform:scale(0)}40%{transform:scale(1);-webkit-transform:scale(1)}}@keyframes layui-m-anim-loading{0%,100%,80%{transform:scale(0);-webkit-transform:scale(0)}40%{transform:scale(1);-webkit-transform:scale(1)}}.layui-m-layer2 .layui-m-layercont i:first-child{margin-left:0;-webkit-animation-delay:-.32s;animation-delay:-.32s}.layui-m-layer2 .layui-m-layercont i.layui-m-layerload{-webkit-animation-delay:-.16s;animation-delay:-.16s}.layui-m-layer2 .layui-m-layercont>div{line-height:22px;padding-top:7px;margin-bottom:20px;font-size:14px}.layui-m-layerbtn{display:box;display:-moz-box;display:-webkit-box;width:100%;height:50px;line-height:50px;font-size:0;border-top:1px solid #D0D0D0;background-color:#F2F2F2}.layui-m-layerbtn span{display:block;-moz-box-flex:1;box-flex:1;-webkit-box-flex:1;font-size:14px;cursor:pointer}.layui-m-layerbtn span[yes]{color:#40AFFE}.layui-m-layerbtn span[no]{border-right:1px solid #D0D0D0;border-radius:0 0 0 5px}.layui-m-layerbtn span:active{background-color:#F6F6F6}.layui-m-layerend{position:absolute;right:7px;top:10px;width:30px;height:30px;border:0;font-weight:400;background:0 0;cursor:pointer;-webkit-appearance:none;font-size:30px}.layui-m-layerend::after,.layui-m-layerend::before{position:absolute;left:5px;top:15px;content:'';width:18px;height:1px;background-color:#999;transform:rotate(45deg);-webkit-transform:rotate(45deg);border-radius:3px}.layui-m-layerend::after{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}body .layui-m-layer .layui-m-layer-footer{position:fixed;width:95%;max-width:100%;margin:0 auto;left:0;right:0;bottom:10px;background:0 0}.layui-m-layer-footer .layui-m-layercont{padding:20px;border-radius:5px 5px 0 0;background-color:rgba(255,255,255,.8)}.layui-m-layer-footer .layui-m-layerbtn{display:block;height:auto;background:0 0;border-top:none}.layui-m-layer-footer .layui-m-layerbtn span{background-color:rgba(255,255,255,.8)}.layui-m-layer-footer .layui-m-layerbtn span[no]{color:#FD482C;border-top:1px solid #c2c2c2;border-radius:0 0 5px 5px}.layui-m-layer-footer .layui-m-layerbtn span[yes]{margin-top:10px;border-radius:5px}body .layui-m-layer .layui-m-layer-msg{width:auto;max-width:90%;margin:0 auto;bottom:-150px;background-color:rgba(0,0,0,.7);color:#fff}.layui-m-layer-msg .layui-m-layercont{padding:10px 20px}
\ 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