|
@@ -7,396 +7,10 @@
|
|
|
<title>星动双十一</title>
|
|
|
<link rel="icon" href="../static/img/favicon2.ico" type="img/x-ico">
|
|
|
<link rel="stylesheet" href="../static/js/vender/toastr/toastr.min.css">
|
|
|
- <link rel="stylesheet" href="../static/css/changePhoneActivity.css">
|
|
|
+ <link rel="stylesheet" href="../static/css/doubleElevenActivity.css">
|
|
|
<script src="../static/js/vender/jquery-3.4.1.min.js"></script>
|
|
|
<script src="../static/js/vender/toastr/toastr.min.js"></script>
|
|
|
<script src="../static/js/vender/config.js"></script>
|
|
|
- <style>
|
|
|
- .header-container{
|
|
|
- width: 7.5rem;
|
|
|
- height: 6.64rem;
|
|
|
- margin: 0 auto;
|
|
|
- position: relative;
|
|
|
- overflow: hidden;
|
|
|
- }
|
|
|
- .top-banner{
|
|
|
- width: 101%;
|
|
|
- height: 6.64rem;
|
|
|
- }
|
|
|
- .middle-container{
|
|
|
- width: 7.5rem;
|
|
|
- /* height: 28.9rem; */
|
|
|
- margin: 0 auto;
|
|
|
- position: relative;
|
|
|
- background: url(../static/img/doubleElevenActivity/bg.png) no-repeat;
|
|
|
- background-size: 100% 100%;
|
|
|
- margin-top: -2.06rem;
|
|
|
- padding-bottom: 0.5rem;
|
|
|
- }
|
|
|
- .tips{
|
|
|
- width: 6.9rem;
|
|
|
- height: 1.76rem;
|
|
|
- position: absolute;
|
|
|
- top: 1.82rem;
|
|
|
- left: 0;
|
|
|
- z-index: 9;
|
|
|
- }
|
|
|
- .step-container{
|
|
|
- width: 6.9rem;
|
|
|
- position: relative;
|
|
|
- padding-top: 2.82rem;
|
|
|
- margin-left: 0.3rem;
|
|
|
- }
|
|
|
- .main-step-content{
|
|
|
- width: 6.9rem;
|
|
|
- position: relative;
|
|
|
- z-index: 9;
|
|
|
- border-radius: 0.1rem;
|
|
|
- background-color: #ffffff;
|
|
|
- padding-bottom: 1.18rem;
|
|
|
- }
|
|
|
- .top-step{
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- }
|
|
|
- .hongbao{
|
|
|
- width: 1.44rem;
|
|
|
- height: 1.5rem;
|
|
|
- margin-top: 0.4rem;
|
|
|
- }
|
|
|
- .step{
|
|
|
- width: 0.52rem;
|
|
|
- height: 0.24rem;
|
|
|
- margin-top: 0.76rem;
|
|
|
- }
|
|
|
- .buyphone{
|
|
|
- width: 1.44rem;
|
|
|
- height: 1.5rem;
|
|
|
- margin-top: 0.4rem;
|
|
|
- }
|
|
|
- .red-packet{
|
|
|
- margin: 0.3rem 0.3rem 0 0.3rem;
|
|
|
- }
|
|
|
- .red-packet-next{
|
|
|
- margin: 0.3rem;
|
|
|
- }
|
|
|
- .packet{
|
|
|
- position: relative;
|
|
|
- width: 6.32rem;
|
|
|
- height: 1.56rem;
|
|
|
- margin-bottom: 0.3rem;
|
|
|
- }
|
|
|
- .fxhb{
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
- .money{
|
|
|
- position: absolute;
|
|
|
- top: 0.34rem;
|
|
|
- left: 0.3rem;
|
|
|
- font-size: 0.14rem;
|
|
|
- color: #AC6C23;
|
|
|
- }
|
|
|
- .money-mark{
|
|
|
- font-size: 0.36rem;
|
|
|
- }
|
|
|
- .money-val{
|
|
|
- font-size: 0.64rem;
|
|
|
- }
|
|
|
- .packet-title{
|
|
|
- position: absolute;
|
|
|
- top: 0.36rem;
|
|
|
- right: 0.82rem;
|
|
|
- font-size: 0.36rem;
|
|
|
- color: #FEF1C4;
|
|
|
- }
|
|
|
- .packet-time{
|
|
|
- position: absolute;
|
|
|
- bottom: 0.1rem;
|
|
|
- right: 1.58rem;
|
|
|
- font-size: 0.24rem;
|
|
|
- color: #FEF1C4;
|
|
|
- }
|
|
|
- .account{
|
|
|
- font-size: 0.28rem;
|
|
|
- text-align: center;
|
|
|
- padding-bottom: 0.2rem;
|
|
|
- }
|
|
|
- .step-item{
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
- .step-text{
|
|
|
- font-size: 0.24rem;
|
|
|
- }
|
|
|
- .join-activity-btn{
|
|
|
- width: 6.6rem;
|
|
|
- height: 1.8rem;
|
|
|
- line-height: 1.4rem;
|
|
|
- position: absolute;
|
|
|
- bottom: -0.74rem;
|
|
|
- left: 0.15rem;
|
|
|
- z-index: 99;
|
|
|
- }
|
|
|
- .join-activity{
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
- .activity-btn-content{
|
|
|
- width: 5.2rem;
|
|
|
- font-size: 0.44rem;
|
|
|
- position: absolute;
|
|
|
- left: 1.06rem;
|
|
|
- top: 0;
|
|
|
- }
|
|
|
- .activity-btn-text{
|
|
|
- font-size: 0.44rem;
|
|
|
- color: #BB3804;
|
|
|
- }
|
|
|
- .icon-left{
|
|
|
- width: 0.2rem;
|
|
|
- height: 0.32rem;
|
|
|
- }
|
|
|
- .invite-text{
|
|
|
- margin-top: 0.6rem;
|
|
|
- font-size: 0.28rem;
|
|
|
- text-align: center;
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
- .rule-container{
|
|
|
- width: 6.9rem;
|
|
|
- position: relative;
|
|
|
- margin-top: 1.6rem;
|
|
|
- margin-left: 0.3rem;
|
|
|
- }
|
|
|
- .rule-tips{
|
|
|
- width: 6.9rem;
|
|
|
- height: 1.76rem;
|
|
|
- position: absolute;
|
|
|
- top: -1rem;
|
|
|
- left: 0;
|
|
|
- }
|
|
|
- .rule-content{
|
|
|
- width: 6.9rem;
|
|
|
- height: 6.2rem;
|
|
|
- border-radius: 0.1rem;
|
|
|
- background-color: #ffffff;
|
|
|
- overflow-y: scroll;
|
|
|
- position: relative;
|
|
|
- z-index: 99;
|
|
|
- }
|
|
|
- .rule-point{
|
|
|
- margin: 0.2rem;
|
|
|
- font-size: 0.24rem;
|
|
|
- line-height: 0.4rem;
|
|
|
- }
|
|
|
- .packet-block{
|
|
|
- width: 6.9rem;
|
|
|
- min-height: 2.16rem;
|
|
|
- max-height: 9.16rem;
|
|
|
- border-radius: 0.1rem;
|
|
|
- background-color: #ffffff;
|
|
|
- overflow-y: scroll;
|
|
|
- position: relative;
|
|
|
- z-index: 99;
|
|
|
- }
|
|
|
- .packet-titles{
|
|
|
- position: absolute;
|
|
|
- top: 0.14rem;
|
|
|
- left: 2.32rem;
|
|
|
- font-size: 0.36rem;
|
|
|
- color: #FEF1C4;
|
|
|
- }
|
|
|
- .packet-times{
|
|
|
- position: absolute;
|
|
|
- top: 0.64rem;
|
|
|
- right: 1.58rem;
|
|
|
- font-size: 0.24rem;
|
|
|
- color: #FEF1C4;
|
|
|
- }
|
|
|
- .packet-info{
|
|
|
- position: absolute;
|
|
|
- bottom: 0.1rem;
|
|
|
- right: 0.88rem;
|
|
|
- font-size: 0.24rem;
|
|
|
- color: #FEF1C4;
|
|
|
- }
|
|
|
- .share-btn{
|
|
|
- width: 1.04rem;
|
|
|
- height: 0.48rem;
|
|
|
- position: absolute;
|
|
|
- top: 0.24rem;
|
|
|
- right: 0.34rem;
|
|
|
- }
|
|
|
- .share-num{
|
|
|
- position: absolute;
|
|
|
- top: 0.08rem;
|
|
|
- left: 0.12rem;
|
|
|
- font-size: 0.24rem;
|
|
|
- color: #FD1C15;
|
|
|
- }
|
|
|
- .share{
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
- .icon{
|
|
|
- width: 0.2rem;
|
|
|
- height: 0.16rem;
|
|
|
- position: absolute;
|
|
|
- bottom: 0.2rem;
|
|
|
- right: 0.34rem;
|
|
|
- }
|
|
|
- .user-list{
|
|
|
- width: 5.72rem;
|
|
|
- max-height: 5.68rem;
|
|
|
- margin: 0 auto;
|
|
|
- /* background: #FFFFFF; */
|
|
|
- border-radius: 0.2rem;
|
|
|
- border: 0.02rem solid #FFE4E3;
|
|
|
- background-color: #FEF1C4;
|
|
|
- padding: 0.3rem 0.3rem 0 0.3rem;
|
|
|
- overflow-y: scroll;
|
|
|
- display: block;
|
|
|
- }
|
|
|
- .user-item{
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 0.28rem;
|
|
|
- }
|
|
|
- .user-left{
|
|
|
- display: flex;
|
|
|
- }
|
|
|
- .head-img{
|
|
|
- width: 0.52rem;
|
|
|
- height: 0.52rem;
|
|
|
- padding-top: 0.06rem;
|
|
|
- border-radius: 50%;
|
|
|
- }
|
|
|
- .user-info{
|
|
|
- margin-left: 0.14rem;
|
|
|
- font-size: 0.24rem;
|
|
|
- }
|
|
|
- .user-name{
|
|
|
- color: #272624;
|
|
|
- }
|
|
|
- .user-time{
|
|
|
- color: #999999;
|
|
|
- }
|
|
|
- .meal{
|
|
|
- font-size: 0.24rem;
|
|
|
- color: #FD2B1B;
|
|
|
- max-width: 1.72rem;
|
|
|
- }
|
|
|
- .receive{
|
|
|
- width: 1.14rem;
|
|
|
- height: 0.52rem;
|
|
|
- line-height: 0.52rem;
|
|
|
- font-size: 0.24rem;
|
|
|
- color: #ffffff;
|
|
|
- background-color: #3B7FFF;
|
|
|
- border-radius: 0.08rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- .pop {
|
|
|
- width: 6.22rem;
|
|
|
- height: 8.5rem;
|
|
|
- position: absolute;
|
|
|
- left: 50%;
|
|
|
- transform: translate(-50%, -50%);
|
|
|
- top: -6.96rem;
|
|
|
- z-index: 999;
|
|
|
- }
|
|
|
- .pop-bg{
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
- .mask {
|
|
|
- width: 100%;
|
|
|
- height: 100vh;
|
|
|
- position: fixed;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- z-index: 9999;
|
|
|
- background: rgba(0, 0, 0, 0.8);
|
|
|
- display: none;
|
|
|
- }
|
|
|
- .top-title{
|
|
|
- position: absolute;
|
|
|
- top: 3.14rem;
|
|
|
- left: 50%;
|
|
|
- transform: translateX(-50%);
|
|
|
- font-size: 0.32rem;
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
- .share-num-text{
|
|
|
- position: absolute;
|
|
|
- top: 4.94rem;
|
|
|
- left: 50%;
|
|
|
- transform: translateX(-50%);
|
|
|
- font-size: 0.4rem;
|
|
|
- color: #F23200;
|
|
|
- letter-spacing: 0.06rem;
|
|
|
- font-weight: 600;
|
|
|
- line-height: 0.56rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- .bottom{
|
|
|
- position: absolute;
|
|
|
- bottom: 0.46rem;
|
|
|
- left: 50%;
|
|
|
- transform: translateX(-50%);
|
|
|
- }
|
|
|
- .bottom-title-row{
|
|
|
- width: 5.16rem;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
- .line{
|
|
|
- width: 1.5rem;
|
|
|
- height: 0.02rem;
|
|
|
- background-color: #ffffff;
|
|
|
- }
|
|
|
- .bottom-title{
|
|
|
- font-size: 0.24rem;
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
- .bottom-share-row{
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- padding-top: 0.18rem;
|
|
|
- margin: 0 0.2rem;
|
|
|
- }
|
|
|
- .left-friend_share,.right-wechat{
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- font-size: 0.28rem;
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
- .friend_share,.wechat{
|
|
|
- width: 0.68rem;
|
|
|
- height: 0.68rem;
|
|
|
- margin-right: 0.2rem;
|
|
|
- }
|
|
|
- .share-text{
|
|
|
- opacity: 0.8;
|
|
|
- }
|
|
|
- .del{
|
|
|
- width: 0.56rem;
|
|
|
- height: 0.56rem;
|
|
|
- position: absolute;
|
|
|
- bottom: -0.3rem;
|
|
|
- left: 50%;
|
|
|
- transform: translateX(-50%);
|
|
|
- }
|
|
|
- .del-img{
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
- </style>
|
|
|
</head>
|
|
|
|
|
|
<body>
|
|
@@ -765,29 +379,34 @@
|
|
|
$('.mask').show();
|
|
|
document.documentElement.style.overflow='auto';
|
|
|
});
|
|
|
- //点击朋友圈
|
|
|
- $('.left-friend_share')[0].addEventListener('click',(e) => {
|
|
|
- if (isAndroid) {
|
|
|
- if(window.native){
|
|
|
- window.native.shareToWechatCircle();
|
|
|
- }else{
|
|
|
- toastr.error('不支持当前环境!');
|
|
|
- }
|
|
|
- }else{
|
|
|
- toastr.error('不支持当前环境!');
|
|
|
- }
|
|
|
+ //点击分享朋友圈
|
|
|
+ $('.left-friend_share')[0].addEventListener('click',()=>{
|
|
|
+ shareHandle('shareToWechatCircle');
|
|
|
});
|
|
|
- //点击微信
|
|
|
- $('.right-wechat')[0].addEventListener('click',(e) => {
|
|
|
+ //点击分享微信
|
|
|
+ $('.right-wechat')[0].addEventListener('click',()=>{
|
|
|
+ shareHandle('shareToWechat');
|
|
|
+ });
|
|
|
+ function shareHandle(type) {
|
|
|
if (isAndroid) {
|
|
|
if(window.native){
|
|
|
- window.native.shareToWechat();
|
|
|
+ window.native[type]();
|
|
|
}else{
|
|
|
- toastr.error('不支持当前环境!');
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error('不支持当前环境!');
|
|
|
+ })
|
|
|
}
|
|
|
- }else{
|
|
|
+ }else{
|
|
|
+ stopManyClick(() => {
|
|
|
toastr.error('不支持当前环境!');
|
|
|
- }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //点击关闭弹窗
|
|
|
+ $('.del')[0].addEventListener('click',()=>{
|
|
|
+ $('.pop').animate({top: '-6.96rem'},"fast");
|
|
|
+ $('.mask').hide();
|
|
|
+ document.documentElement.style.overflow='auto';
|
|
|
});
|
|
|
// //点击分享
|
|
|
// $('.share-node')[0].addEventListener('click',()=>{
|