Commit dd93d0ff by Chao Sun

分享按钮

parent 29625d27
......@@ -36,8 +36,41 @@ input,button{
display: -webkit-flex;
display: flex;
background: #fff;
overflow: hidden;
position: relative;
position: relative;
height:65px;
}
.footer .left{
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 0;
width: 66.66666667%;
}
.footer .right{
width: 33.33333333%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: space-evenly;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 0;
color: #fff;
font-size: 22px;
background: linear-gradient(270deg,#f10000,#ff4e18);
}
.footer li{
color: #fe3400;
......@@ -46,26 +79,74 @@ input,button{
align-items: center;
justify-content:center;
}
.footer li:nth-child(1){
flex: 0 0 18%;
.footer li.kefu_Wrapper{
position: relative;
width: 80px;
height: 100%;
color: #ff3500;
font-size: 12px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-right: 1px #dcdcdc solid;
}
.footer li:nth-child(2){
flex: 0 0 42%;
.footer li.share{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 45%;
height: 100%;
color: #ff3500;
margin-right: 0;
border-right: 1px #dcdcdc solid;
font-size: 13px;
}
.footer li:nth-child(3){
flex: 0 0 40%;
color: #fff;
font-size: 22px;
background: linear-gradient(270deg,#f10000,#ff4e18);
.footer li.peice_wrapper{
display: none;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 65%;
height: 100%;
color: #ff3500;
margin-right: 0;
}
.footer li .icon{
width: 50%;
margin-top: 15px;
.footer li.share img{
max-width: 45%;
}
.footer li .kefu{
font-size: 13px;
margin-bottom: 15px;
color: #fe3400;
}
.footer li .curPrice{
......
......@@ -14,23 +14,27 @@
<div>
<img src="./images/bg.png">
</div>
<div>
<ul class="footer">
<li>
<div class="footer">
<ul class="left">
<li class="kefu_Wrapper">
<a href="http://q.url.cn/abkzV9?_type=wpa&qidian=true" target="_blank"
style="display: contents">
<img class="icon" src="./images/icon.png" alt="icon" >
<div class="kefu">客服</div>
</a>
</li>
<li>
<li class="share" style="display: none;">
<img src="./images/share1.png" alt="share" />
<div>分享产品</div>
</li>
<li class="peice_wrapper">
<div class="curPrice"><span></span>49</div>
<div class="price">原价:<span></span>199/年</div>
</li>
<li class="order">
立即购买
</li>
</ul>
<div class="right">
立即购买
</div>
</div>
<div class="modalBox">
<div class='inputBox'>
......
......@@ -326,20 +326,23 @@ $(function () {
document.getElementById('submit').click()
}
}
isWeiXin()
function isWeiXin() {
var ua = window.navigator.userAgent.toLowerCase();
if (ua.match(/MicroMessenger/i) == 'micromessenger' || ua.match(/_SQ_/i) == '_sq_') {
$('.share').show()
return true;
} else {
$(".share").hide()
return false;
}
}
getWxConfig();
// getWxConfig();
// 获取微信分享配置
function getWxConfig() {
var url = location.href.split('#')[0];
console.log(1)
$.ajax({
type: "POST",
url: api + '/api/wxConfig',
......@@ -372,4 +375,7 @@ $(function () {
}
})
}
$('.share').click(function(){
getWxConfig()
})
});
\ No newline at end of file
......@@ -36,8 +36,41 @@ input,button{
display: -webkit-flex;
display: flex;
background: #fff;
overflow: hidden;
position: relative;
position: relative;
height:65px;
}
.footer .left{
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 0;
width: 66.66666667%;
}
.footer .right{
width: 33.33333333%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: space-evenly;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 0;
color: #fff;
font-size: 22px;
background: linear-gradient(270deg,#f10000,#ff4e18);
}
.footer li{
color: #fe3400;
......@@ -46,26 +79,74 @@ input,button{
align-items: center;
justify-content:center;
}
.footer li:nth-child(1){
flex: 0 0 18%;
.footer li.kefu_Wrapper{
position: relative;
width: 80px;
height: 100%;
color: #ff3500;
font-size: 12px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-right: 1px #dcdcdc solid;
}
.footer li:nth-child(2){
flex: 0 0 42%;
.footer li.share{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 45%;
height: 100%;
color: #ff3500;
margin-right: 0;
border-right: 1px #dcdcdc solid;
font-size: 13px;
}
.footer li:nth-child(3){
flex: 0 0 40%;
color: #fff;
font-size: 22px;
background: linear-gradient(270deg,#f10000,#ff4e18);
.footer li.peice_wrapper{
display: none;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 65%;
height: 100%;
color: #ff3500;
margin-right: 0;
}
.footer li .icon{
width: 50%;
margin-top: 15px;
.footer li.share img{
max-width: 45%;
}
.footer li .kefu{
font-size: 13px;
margin-bottom: 15px;
color: #fe3400;
}
.footer li .curPrice{
......
......@@ -14,23 +14,27 @@
<div>
<img src="./images/bg_toutiao.png">
</div>
<div>
<ul class="footer">
<li>
<div class="footer">
<ul class="left">
<li class="kefu_Wrapper">
<a href="http://q.url.cn/abkzV9?_type=wpa&qidian=true" target="_blank"
style="display: contents">
<img class="icon" src="./images/icon.png" alt="icon" >
<div class="kefu">客服</div>
</a>
</li>
<li>
<li class="share" style="display: none;">
<img src="./images/share1.png" alt="share" />
<div>分享产品</div>
</li>
<li class="peice_wrapper">
<div class="curPrice"><span></span>49</div>
<div class="price">原价:<span></span>199/年</div>
</li>
<li class="order">
立即购买
</li>
</ul>
<div class="right">
立即购买
</div>
</div>
<div class="modalBox">
<div class='inputBox'>
......
......@@ -325,16 +325,18 @@ $(function () {
document.getElementById('submit').click()
}
}
isWeiXin()
function isWeiXin() {
var ua = window.navigator.userAgent.toLowerCase();
if (ua.match(/MicroMessenger/i) == 'micromessenger' || ua.match(/_SQ_/i) == '_sq_') {
$('.share').show()
return true;
} else {
$(".share").hide()
return false;
}
}
getWxConfig();
// getWxConfig();
// 获取微信分享配置
function getWxConfig()
{
......@@ -371,4 +373,7 @@ $(function () {
}
})
}
$('.share').click(function(){
getWxConfig()
})
});
\ 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