Skip to content

libai / footseen-large-website

Go to a project
Commit 8535da97 by libai
Options

测试

parent 514eb255
Inline Side-by-side
Showing with 1374 additions and 160 deletions
index.html
......@@ -418,7 +418,11 @@ $(function(){
if(sessionStorage.jump==2) liveList(1,2)
else liveList(1,1)
getTags()
getTopics(1,typeNum,tagNum,timeNum,sortNum,dayNum)
if(typeNum==2){
var imgNum=Math.floor(Math.random()*11)
getTopics(imgNum,typeNum,tagNum,timeNum,sortNum,dayNum)
}else getTopics(1,typeNum,tagNum,timeNum,sortNum,dayNum)
if(sessionStorage.go=="footseen"){
$.ajax({
url:$ip+'activeLog/webActive',
......@@ -605,9 +609,9 @@ $(function(){
}
else if(_self.attr("data-type")==5){
var imgNum=Math.floor(Math.random()*11)
scrollOk=true;
pageNumber=1
pageNumber=imgNum-1
typeNum=2
$(".side-nav").hide()
$(".tag-big-box").show()
......@@ -617,7 +621,7 @@ $(function(){
$(".like-box").hide()
$(".images-list-box").show()
if(oneImg){
getTopics(1,typeNum,tagNum,timeNum,sortNum,dayNum)
getTopics(imgNum,typeNum,tagNum,timeNum,sortNum,dayNum)
oneImg=false
}else{
scrollTo('.m-box',350)
......@@ -901,11 +905,12 @@ $(function(){
}
if(sessionStorage.jump==5){
scrollNav=false
var imgNum=Math.floor(Math.random()*11)
$(".neck-nav-ul li").removeClass("neck-nav-li-click")
$(".neck-nav-ul li").eq(sessionStorage.jump-1).addClass("neck-nav-li-click")
$(".side-nav").hide()
scrollOk=true;
pageNumber=1
pageNumber=imgNum-1
typeNum=2
$(".tag-big-box").show()
$(".side-tag-ul li").removeClass("tag-click")
......@@ -913,7 +918,7 @@ $(function(){
$(".video-list-box").hide()
$(".like-box").hide()
$(".images-list-box").show()
// getTopics(1,typeNum,tagNum,timeNum,sortNum,dayNum)
// getTopics(imgNum,typeNum,tagNum,timeNum,sortNum,dayNum)
}
if(sessionStorage.jump==6){
scrollNav=false
......
room/imagesRoom.html
......@@ -205,7 +205,7 @@ $(function(){
if(data.selfUp==1) var html='<div><img src="images/icon1.png" alt=""><span>'+data.comment+'</span></div><div class="good-box"><img class="good-btn" data-type="1" src="images/icon2-click.png" alt=""><span>'+data.up+'</span></div>';
else var html='<div><img src="images/icon1.png" alt=""><span>'+data.comment+'</span></div><div class="good-box"><img class="good-btn" data-type="0" src="images/icon2.png" alt=""><span>'+data.up+'</span></div>';
$(".video-btn-box").html(html)
$(".video-time-box").html('<span>'+data.visit+'次观看</span><span>'+timeGet(data.updateTime)[0]+'年'+timeGet(data.updateTime)[1]+'月'+timeGet(data.updateTime)[2]+'日</span>')
$(".video-time-box").html('<span>'+data.visit+'次观看</span>')
var html=[];
html+='<img class="video-face-box-face" src="https://zhibocdn.yabolive.net/comm'+data.face+'?x-oss-process=image/resize,w_40" alt="">';
html+='<p class="video-face-box-name">'+data.nickname+'</p>';
......
vip/css/index.css
......@@ -46,12 +46,70 @@
top: 45px;
left: 50px;
}
.vip-tip-bg {
width: 1200px;
height: 1624px;
background: url(../images/vip-tip-bg.png) no-repeat;
margin-top: 32px;
position: relative;
}
.vip-bottom {
width: 160px;
position: absolute;
bottom: 10px;
margin-left: -80px;
left: 50%;
}
.vip-tips-content {
width: 1042px;
height: 931px;
left: 79px;
background: url(../images/vip-tips-content.png) no-repeat;
position: absolute;
bottom: 80px;
}
.vip-tip-text1 {
color: #53402B;
text-align: center;
font-size: 16px;
padding-top: 220px;
line-height: 28px;
}
.vip-tip-text1 span {
color: #FFF3E4;
}
.vip-back {
text-decoration: underline;
cursor: pointer;
}
.vip-tip-text2 h2 {
text-align: center;
font-size: 18px;
font-weight: 700;
color: #53402B;
margin-top: 65px;
}
.vip-tip-text2 > div {
font-size: 14px;
text-align: center;
color: #53402B;
line-height: 32px;
padding-top: 20px;
}
.vip-tip-text2 > div span {
color: #19D6FF;
}
.feather {
position: absolute;
right: 0;
top: 175px;
pointer-events: none;
}
.vip-icon {
position: absolute;
right: 0;
top: 43px;
}
.vip-bottom-bg {
width: 976px;
height: 481px;
......@@ -60,6 +118,53 @@
z-index: 2;
bottom: 0;
}
.stealth-box {
display: none;
transition: 0.2s all;
width: 54px;
height: 20px;
border-radius: 50px;
background: linear-gradient(to right, #DDAA72, #B1793A);
position: absolute;
line-height: 20px;
color: #fff;
font-size: 12px;
text-indent: 12px;
top: 82px;
left: 69px;
cursor: pointer;
}
.stealth-box > div {
transition: 0.2s all;
height: 18px;
width: 18px;
background: #fff;
border-radius: 50%;
position: absolute;
top: 1px;
left: 1px;
}
.stealth-box2 {
background: #AAAAAA;
text-indent: -12px;
}
.stealth-box2 div {
left: 35px;
}
.vip-question {
color: #666666;
font-size: 14px;
position: absolute;
line-height: 22px;
right: 0;
top: -30px;
cursor: pointer;
}
.vip-question > img {
vertical-align: middle;
margin-top: -2px;
margin-left: 4px;
}
.left-vip-ul {
height: 522px;
width: 211px;
......@@ -97,13 +202,13 @@
color: #333333;
font-size: 18px;
font-weight: 700;
text-indent: 135px;
text-indent: 140px;
padding-top: 24px;
}
.vip-top-card-p2 {
color: #666666;
font-size: 14px;
text-indent: 135px;
text-indent: 140px;
margin-top: 4px;
}
.vip-top-card-p3 {
......@@ -114,7 +219,7 @@
height: 20px;
text-align: center;
border-radius: 20px;
margin-left: 134px;
margin-left: 140px;
margin-top: 4px;
}
.vip-content-card {
......@@ -144,7 +249,7 @@
overflow: hidden;
}
.vip-content-box1 .vip-bar-box > div {
width: 50%;
width: 0%;
height: 6px;
background: linear-gradient(to right, #E7B884, #B1793B);
border-radius: 4px;
......@@ -182,6 +287,30 @@
color: #999999;
font-size: 14px;
}
.vip-bottom-ul li:nth-child(1):hover .vip-tips1 {
display: block;
}
.vip-bottom-ul li:nth-child(2):hover .vip-tips2 {
display: block;
}
.vip-bottom-ul li:nth-child(3):hover .vip-tips3 {
display: block;
}
.vip-bottom-ul li:nth-child(4):hover .vip-tips4 {
display: block;
}
.vip-bottom-ul li:nth-child(5):hover .vip-tips5 {
display: block;
}
.vip-bottom-ul li:nth-child(6):hover .vip-tips6 {
display: block;
}
.vip-bottom-ul li:nth-child(7):hover .vip-tips7 {
display: block;
}
.vip-bottom-ul li:nth-child(8):hover .vip-tips8 {
display: block;
}
.vip-bottom-btn-box {
width: 220px;
height: 120px;
......@@ -760,3 +889,320 @@
margin-left: 18px;
padding-top: 10px;
}
.vip-layer {
width: 430px;
height: 500px;
background: #FFFFFF;
border-radius: 8px;
position: relative;
display: none;
}
.vip-layer .vip-layer-top {
text-align: center;
font-size: 20px;
color: #333333;
height: 70px;
line-height: 70px;
font-weight: 700;
}
.vip-layer .vip-layer-box1 {
height: 60px;
width: 320px;
background: #F4F5F8;
border-radius: 8px;
margin: 0 auto;
position: relative;
cursor: pointer;
}
.vip-layer .vip-layer-box2 {
height: 60px;
width: 320px;
background: #F4F5F8;
border-radius: 8px;
margin: 0 auto;
margin-top: 15px;
position: relative;
cursor: pointer;
}
.vip-layer .vip-layer-box3 {
height: 60px;
width: 320px;
background: #F4F5F8;
border-radius: 8px;
margin: 0 auto;
margin-top: 15px;
position: relative;
cursor: pointer;
}
.vip-layer .vip-layer-box4 {
height: 60px;
width: 320px;
background: #F4F5F8;
border-radius: 8px;
margin: 0 auto;
margin-top: 15px;
position: relative;
cursor: pointer;
}
.vip-layer .vip-layer-box-click {
height: 58px;
width: 318px;
background: #FFEDF4;
border: 1px solid #E62E74;
}
.vip-layer .vip-layer-box-click .vip-layer-box-span1 {
height: 58px;
line-height: 58px;
text-indent: 29px;
}
.vip-layer .vip-layer-box-click .vip-layer-box-span2 {
height: 58px;
line-height: 58px;
right: -1px;
}
.vip-layer .vip-layer-box-span1 {
height: 60px;
display: inline-block;
width: 200px;
line-height: 60px;
text-indent: 30px;
}
.vip-layer .vip-layer-box-span2 {
height: 60px;
display: inline-block;
width: 80px;
line-height: 60px;
position: absolute;
right: 0;
color: #E53985;
}
.vip-layer .vip-layer-box-span2 > img {
vertical-align: middle;
margin-top: -4px;
margin-right: 8px;
}
.vip-layer .vip-layer-tips {
font-size: 12px;
color: #AAAAAA;
text-align: center;
margin-top: 34px;
}
.vip-layer .vip-layer-btn {
width: 220px;
height: 50px;
background: #E62E74;
border-radius: 50px;
text-align: center;
color: #fff;
font-size: 16px;
line-height: 50px;
cursor: pointer;
margin: 0 auto;
margin-top: 15px;
}
.vip-frame {
position: absolute;
width: 110px;
height: 110px;
z-index: 1;
top: -8px;
left: 35px;
font-size: 0;
}
.vip-frame1 {
background: url(../images/v1.png) no-repeat;
background-size: 100% 100%;
}
.vip-frame1 > span {
color: #014F27;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 70px;
}
.vip-frame2 {
background: url(../images/v2.png) no-repeat;
background-size: auto 100%;
animation: swiper2 4.8s steps(16, start) 0ms infinite normal backwards;
background-position: 0 0;
}
.vip-frame2 > span {
color: #003A55;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 70px;
}
@keyframes swiper2 {
0% {
background-position: 0 0;
}
28% {
background-position: -1760px 0;
}
100% {
background-position: -1760px 0;
}
}
.vip-frame3 {
background: url(../images/v3.png) no-repeat;
background-size: auto 100%;
animation: swiper3 5.6s steps(19, start) 0ms infinite normal backwards;
background-position: 0 0;
}
.vip-frame3 > span {
color: #9B0B30;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 70px;
}
@keyframes swiper3 {
0% {
background-position: 0 0;
}
31% {
background-position: -2090px 0;
}
100% {
background-position: -2090px 0;
}
}
.vip-frame4 {
background: url(../images/v4.png) no-repeat;
background-size: auto 100%;
animation: swiper4 5s steps(17, start) 0ms infinite normal backwards;
background-position: 0 0;
}
.vip-frame4 > span {
color: #9B0B30;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 68px;
}
@keyframes swiper4 {
0% {
background-position: 0 0;
}
29% {
background-position: -1870px 0;
}
100% {
background-position: -1870px 0;
}
}
.vip-frame5 {
background: url(../images/v5.png) no-repeat;
background-size: auto 100%;
animation: swiper5 4.6s steps(20, start) 0ms infinite;
background-position: 0 0;
}
.vip-frame5 > span {
color: #fff;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 66px;
}
@keyframes swiper5 {
0% {
background-position: 0 0;
}
34% {
background-position: -2200px 0;
}
100% {
background-position: -2200px 0;
}
}
.vip-frame6 {
background: url(../images/v6.png) no-repeat;
background-size: auto 100%;
animation: swiper6 4.8s steps(22, start) 0ms infinite;
background-position: 0 0;
}
.vip-frame6 > span {
color: #fff;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 74px;
}
@keyframes swiper6 {
0% {
background-position: 0 0;
}
37% {
background-position: -2420px 0;
}
100% {
background-position: -2420px 0;
}
}
.vip-frame7 {
background: url(../images/v7.png) no-repeat;
background-size: auto 100%;
animation: swiper7 4.8s steps(22, start) 0ms infinite;
background-position: 0 0;
}
.vip-frame7 > span {
color: #fff;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 72px;
}
@keyframes swiper7 {
0% {
background-position: 0 0;
}
37% {
background-position: -2420px 0;
}
100% {
background-position: -2420px 0;
}
}
vip/css/index.less
......@@ -47,12 +47,72 @@
top: 45px;
left: 50px;
}
.vip-tip-bg{
width: 1200px;
height: 1624px;
background: url(../images/vip-tip-bg.png)no-repeat;
margin-top: 32px;
position: relative;
}
.vip-bottom{
width: 160px;
position: absolute;
bottom: 10px;
margin-left: -80px;
left: 50%;
}
.vip-tips-content{
width: 1042px;
height: 931px;
left: 79px;
background: url(../images/vip-tips-content.png)no-repeat;
position: absolute;
bottom: 80px;
}
.vip-tip-text1{
color: #53402B;
text-align: center;
font-size: 16px;
padding-top: 220px;
line-height: 28px;
span{
color: #FFF3E4;
}
}
.vip-back{
text-decoration: underline;
cursor: pointer;
}
.vip-tip-text2{
h2{
text-align: center;
font-size: 18px;
font-weight: 700;
color: #53402B;
margin-top: 65px;
}
>div{
font-size: 14px;
text-align: center;
color: #53402B;
line-height: 32px;
padding-top: 20px;
span{
color: #19D6FF;
}
}
}
.feather{
position: absolute;
right: 0;
top: 175px;
pointer-events: none;
}
.vip-icon{
position: absolute;
right: 0;
top: 43px;
}
.vip-bottom-bg{
width: 976px;
height: 481px;
......@@ -61,6 +121,53 @@
z-index: 2;
bottom: 0;
}
.stealth-box{
display: none;
transition: 0.2s all;
width: 54px;
height: 20px;
border-radius: 50px;
background:linear-gradient(to right,#DDAA72,#B1793A);
position: absolute;
line-height: 20px;
color: #fff;
font-size: 12px;
text-indent: 12px;
top: 82px;
left: 69px;
cursor: pointer;
>div{
transition: 0.2s all;
height: 18px;
width: 18px;
background: #fff;
border-radius: 50%;
position: absolute;
top: 1px;
left: 1px;
}
}
.stealth-box2{
background: #AAAAAA;
text-indent: -12px;
div{
left: 35px;
}
}
.vip-question{
color: #666666;
font-size: 14px;
position: absolute;
line-height: 22px;
right: 0;
top: -30px;
cursor: pointer;
>img{
vertical-align: middle;
margin-top: -2px;
margin-left: 4px;
}
}
.left-vip-ul{
height: 522px;
width: 211px;
......@@ -100,13 +207,13 @@
color: #333333;
font-size: 18px;
font-weight: 700;
text-indent: 135px;
text-indent: 140px;
padding-top: 24px;
}
.vip-top-card-p2{
color: #666666;
font-size: 14px;
text-indent: 135px;
text-indent: 140px;
margin-top: 4px;
}
.vip-top-card-p3{
......@@ -117,7 +224,7 @@
height: 20px;
text-align: center;
border-radius: 20px;
margin-left: 134px;
margin-left: 140px;
margin-top: 4px;
}
.vip-content-card{
......@@ -145,7 +252,7 @@
margin-right: 8px;
overflow: hidden;
>div{
width: 50%;
width: 0%;
height: 6px;
background:linear-gradient(to right,#E7B884,#B1793B);
border-radius: 4px;
......@@ -186,6 +293,47 @@
}
}
}
.vip-bottom-ul li:nth-child(1):hover{
.vip-tips1{
display: block;
}
}
.vip-bottom-ul li:nth-child(2):hover{
.vip-tips2{
display: block;
}
}
.vip-bottom-ul li:nth-child(3):hover{
.vip-tips3{
display: block;
}
}
.vip-bottom-ul li:nth-child(4):hover{
.vip-tips4{
display: block;
}
}
.vip-bottom-ul li:nth-child(5):hover{
.vip-tips5{
display: block;
}
}
.vip-bottom-ul li:nth-child(6):hover{
.vip-tips6{
display: block;
}
}
.vip-bottom-ul li:nth-child(7):hover{
.vip-tips7{
display: block;
}
}
.vip-bottom-ul li:nth-child(8):hover{
.vip-tips8{
display: block;
}
}
.vip-bottom-btn-box{
width: 220px;
height: 120px;
......@@ -764,4 +912,323 @@
margin-left: 18px;
padding-top: 10px;
}
}
.vip-layer{
width: 430px;
height: 500px;
background: #FFFFFF;
border-radius: 8px;
position: relative;
display: none;
.vip-layer-top{
text-align: center;
font-size: 20px;
color: #333333;
height: 70px;
line-height: 70px;
font-weight: 700;
}
.vip-layer-box1{
height: 60px;
width: 320px;
background: #F4F5F8;
border-radius: 8px;
margin: 0 auto;
position: relative;
cursor: pointer;
}
.vip-layer-box2{
height: 60px;
width: 320px;
background: #F4F5F8;
border-radius: 8px;
margin: 0 auto;
margin-top: 15px;
position: relative;
cursor: pointer;
}
.vip-layer-box3{
height: 60px;
width: 320px;
background: #F4F5F8;
border-radius: 8px;
margin: 0 auto;
margin-top: 15px;
position: relative;
cursor: pointer;
}
.vip-layer-box4{
height: 60px;
width: 320px;
background: #F4F5F8;
border-radius: 8px;
margin: 0 auto;
margin-top: 15px;
position: relative;
cursor: pointer;
}
.vip-layer-box-click{
height: 58px;
width: 318px;
background: #FFEDF4;
border: 1px solid #E62E74;
.vip-layer-box-span1{
height: 58px;
line-height: 58px;
text-indent: 29px;
}
.vip-layer-box-span2{
height: 58px;
line-height: 58px;
right: -1px;
}
}
.vip-layer-box-span1{
height: 60px;
display: inline-block;
width: 200px;
line-height: 60px;
text-indent: 30px;
}
.vip-layer-box-span2{
height: 60px;
display: inline-block;
width: 80px;
line-height: 60px;
position: absolute;
right: 0;
color: #E53985;
>img{
vertical-align: middle;
margin-top: -4px;
margin-right: 8px;
}
}
.vip-layer-tips{
font-size: 12px;
color: #AAAAAA;
text-align: center;
margin-top: 34px;
}
.vip-layer-btn{
width: 220px;
height: 50px;
background: #E62E74;
border-radius: 50px;
text-align: center;
color: #fff;
font-size: 16px;
line-height: 50px;
cursor: pointer;
margin: 0 auto;
margin-top: 15px;
}
}
.vip-frame{
position: absolute;
width: 110px;
height: 110px;
z-index: 1;
top: -8px;
left: 35px;
font-size: 0;
}
.vip-frame1{
background: url(../images/v1.png)no-repeat;
background-size: 100% 100%;
>span{
color: #014F27;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 70px;
}
}
.vip-frame2{
background: url(../images/v2.png)no-repeat;
background-size: auto 100%;
animation: swiper2 4.8s steps(16, start) 0ms infinite normal backwards;
background-position: 0 0;
>span{
color: #003A55;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 70px;
}
}
@keyframes swiper2 {
0% {
background-position: 0 0;
}
28% {
background-position: -1760px 0;
}
100%{
background-position: -1760px 0;
}
}
.vip-frame3{
background: url(../images/v3.png)no-repeat;
background-size: auto 100%;
animation: swiper3 5.6s steps(19, start) 0ms infinite normal backwards;
background-position: 0 0;
>span{
color: #9B0B30;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 70px;
}
}
@keyframes swiper3 {
0% {
background-position: 0 0;
}
31% {
background-position: -2090px 0;
}
100%{
background-position: -2090px 0;
}
}
.vip-frame4{
background: url(../images/v4.png)no-repeat;
background-size: auto 100%;
animation: swiper4 5s steps(17, start) 0ms infinite normal backwards;
background-position: 0 0;
>span{
color: #9B0B30;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 68px;
}
}
@keyframes swiper4 {
0% {
background-position: 0 0;
}
29% {
background-position: -1870px 0;
}
100%{
background-position: -1870px 0;
}
}
.vip-frame5{
background: url(../images/v5.png)no-repeat;
background-size: auto 100%;
animation: swiper5 4.6s steps(20, start) 0ms infinite ;
background-position: 0 0;
>span{
color: #fff;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 66px;
}
}
@keyframes swiper5 {
0% {
background-position: 0 0;
}
34%{
background-position: -2200px 0;
}
100%{
background-position: -2200px 0;
}
}
.vip-frame6{
background: url(../images/v6.png)no-repeat;
background-size: auto 100%;
animation: swiper6 4.8s steps(22, start) 0ms infinite ;
background-position: 0 0;
>span{
color: #fff;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 74px;
}
}
@keyframes swiper6 {
0% {
background-position: 0 0;
}
37%{
background-position: -2420px 0;
}
100%{
background-position: -2420px 0;
}
}
.vip-frame7{
background: url(../images/v7.png)no-repeat;
background-size: auto 100%;
animation: swiper7 4.8s steps(22, start) 0ms infinite ;
background-position: 0 0;
>span{
color: #fff;
font-size: 12px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
/* background: pink; */
left: 50%;
margin-left: -15px;
top: 72px;
}
}
@keyframes swiper7 {
0% {
background-position: 0 0;
}
37%{
background-position: -2420px 0;
}
100%{
background-position: -2420px 0;
}
}
\ No newline at end of file
vip/index.html
......@@ -19,16 +19,16 @@
<meta name="description" content="footseen，腳控足控天堂，絲足美腿視訊影片，台灣足控第一高效約會軟體，免費影片立即觀看，在線美女激情互動，成人視訊線上體驗，徹底釋放你的慾望。">
<link rel="stylesheet" href="../css/base.css">
<link rel="stylesheet" href="../css/layer.css">
<link rel="stylesheet" href="../css/login.css?v=2022071902">
<link rel="stylesheet" href="../css/login.css?v=20220704">
<link rel="stylesheet" href="css/index.css?v=20220630">
<script src="https://accounts.google.com/gsi/client" async defer></script>
<script src="https://www.footseen.xyz/lib/hello.js"></script>
<script src="lib/hello.js"></script>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js"></script>
</head>
<body style="background: #F4F5F8;">
<div class="neck-nav">
<div class="neck-nav-content">
<a href="https://www.footseen.xyz/index.html"><img class="logo" src="../images/logo.png" alt=""></a>
<a href="http://test.ybact.ishuaji.cn/active2022/footseen/index.html"><img class="logo" src="../images/logo.png" alt=""></a>
<div class="nav-login-big-box">
<!-- <div style="display: none;" class=nav-login-btn>登入/註冊</div>
<div style="display: none;" class="nav-login">
......@@ -53,167 +53,461 @@
</div>
<div style="height: 60px;"></div>
<div class="m-box">
<div class="vip-h2"><div class="vip-line"></div>VIP中心</div>
<div class="vip-content">
<div class="left-bg">
<div style="height: 20px;"></div>
<ul class="left-vip-ul">
<li class="card-click">玄鐵</li>
<li>寶石</li>
<li>青銅</li>
<li>水晶</li>
<li>鉑金</li>
<li>鑽石</li>
<li>星耀</li>
<li>王者</li>
</ul>
</div>
<div class="right-bg">
<div class="vip-card">
<div class="vip-top-card">
<img class="vip-top-card-face" src="https://www.footseen.xyz/images/boy.png" alt="">
<p class="vip-top-card-p1">用戶暱稱預留</p>
<p class="vip-top-card-p3">未開通會員</p>
</div>
<div class="vip-content-card">
<div class="vip-content-box1">
VIP1 <div class="vip-bar-box"><div></div></div> VIP10
</div>
<div class="vip-content-box2">
當前等級:<span>VIP2</span>，再送<span>100</span>寶石即可升級為VIP3
</div>
</div>
<div class="vip-m">
<div class="vip-h2"><div class="vip-line"></div>VIP中心</div>
<div class="vip-content">
<div class="vip-question">VIP說明<img src="images/question.png" alt=""></div>
<div class="left-bg">
<div style="height: 20px;"></div>
<ul class="left-vip-ul">
<li data-type2="1" data-type="1">玄鐵</li>
<li data-type2="2" data-type="11">寶石</li>
<li data-type2="3" data-type="21">青銅</li>
<li data-type2="4" data-type="31">水晶</li>
<li data-type2="5" data-type="41">鉑金</li>
<li data-type2="6" data-type="45">鑽石</li>
<li data-type2="7" data-type="51">星耀</li>
<li data-type2="8" data-type="52">王者</li>
</ul>
</div>
<img class="feather" src="images/feather.png" alt="">
<div class="vip-bottom-bg">
<ul class="vip-bottom-ul">
<li>
<div class="vip-tips1">
<div class="vip-tips-p1"><div></div> 激活座駕</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP1及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">激活用戶擁有的座駕並在直播間展示。<br>注意：如果未開通VIP，即使擁有座駕也無法在直播間顯示。</div>
<div class="vip-tips-img"><img src="images/vip-tips1.png" alt=""></div>
<div class="vip-tips-jiao"></div>
</div>
<img src="images/t1-no.png" alt="">
<p>激活座駕</p>
</li>
<li>
<div class="vip-tips2">
<div class="vip-tips-p1"><div></div> 激活VIP等级</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP1及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期内，激活富豪等級對應的銘牌，并在用戶資料卡，平台榜單，空間等処展示。儅用戶在直播 間發言時，將展示對應的銘牌，同時昵稱顔色也相應發生變化。富豪等級不同，對應的銘牌不同。</div>
<div class="vip-tips-img"><img src="images/vip-tips2.png" alt=""></div>
<div class="vip-tips-jiao"></div>
<div class="right-bg">
<div class="vip-card">
<img class="vip-icon" src="images/i1.png" alt="">
<div class="vip-top-card">
<div class="vip-frame">
<span></span>
</div>
<img src="images/t2-no.png" alt="">
<p>激活VIP等級</p>
</li>
<li>
<div class="vip-tips3">
<div class="vip-tips-p1"><div></div> 頭像掛件</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP11及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期內，在直播間內顯示主播特別的頭像框</div>
<div class="vip-tips-img"><img src="images/vip-tips3.png" alt=""></div>
<div class="vip-tips-jiao"></div>
</div>
<img src="images/t3-no.png" alt="">
<p>頭像掛件</p>
</li>
<li>
<div class="vip-tips4">
<div class="vip-tips-p1"><div></div> 尊貴名片</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP21及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期內，在直播間內的個人卡片上展示不同的描邊特效。</div>
<div class="vip-tips-img"><img src="images/vip-tips4.png" alt=""></div>
<div class="vip-tips-jiao"></div>
</div>
<img src="images/t4-no.png" alt="">
<p>尊貴名片</p>
</li>
<li>
<div class="vip-tips5">
<div class="vip-tips-p1"><div></div> 尊貴名片</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP31及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期內，進入直播間有專屬的進場特效。富豪等級不同，進場特效不同。</div>
<div class="vip-tips-img"><img src="images/vip-tips5.png" alt=""></div>
<div class="vip-tips-jiao"></div>
</div>
<img src="images/t5-no.png" alt="">
<p>進場特效</p>
</li>
<li>
<div class="vip-tips6">
<div class="vip-tips-p1"><div></div> 尊貴名片</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP31及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期內，用戶發言有專屬的發言框底色，發言更炫酷，更引人注目哦<br>符號等級不同，底框顏色不同。</div>
<div class="vip-tips-img"><img src="images/vip-tips6.png" alt=""></div>
<div class="vip-tips-jiao"></div>
</div>
<img src="images/t6-no.png" alt="">
<p>發言框底色</p>
</li>
<li>
<div class="vip-tips7">
<div class="vip-tips-p1"><div></div> 尊貴名片</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP31及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期內，用戶發言有專屬的發言框底色，發言更炫酷，更引人注目哦<br>符號等級不同，底框顏色不同。</div>
<div class="vip-tips-img"><img src="images/vip-tips6.png" alt=""></div>
<div class="vip-tips-jiao"></div>
<img class="vip-top-card-face" src="images/boy.png" alt="">
<p class="vip-top-card-p1"></p>
<p style="display:none" class="vip-top-card-p2"></p>
<p style="display: none;" class="vip-top-card-p3">未開通會員</p>
</div>
<div class="vip-content-card">
<div class="vip-content-box1">
<span class="vip-level">VIP--</span> <div class="vip-bar-box"><div></div></div> <span class="vip-level2">VIP--</span>
</div>
<img src="images/t7-no.png" alt="">
<p>進房間隱身</p>
</li>
<li>
<div class="vip-tips8">
<div class="vip-tips-p1"><div></div> 尊貴名片</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP41及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期內，在直播間的用戶可以防止除主播外的其他人踢出/禁言。</div>
<div class="vip-tips-jiao"></div>
<div class="vip-content-box2">
<!-- 當前等級:<span>VIP2</span>，再送<span>100</span>寶石即可升級為VIP3 -->
</div>
<img src="images/t8-no.png" alt="">
<p>防踢防禁言</p>
</li>
</ul>
<div class="vip-bottom-btn-box">
<p class="vip-bottom-btn-p1">連續包月: <span>100寶石</span>/月</p>
<p class="vip-bottom-btn-p2">首次開通贈送XX座駕7天</p>
<div class="vip-bottom-btn">開通會員</div>
</div>
</div>
<img class="feather" src="images/feather.png" alt="">
<div class="vip-bottom-bg">
<ul class="vip-bottom-ul">
<li>
<div class="vip-tips1">
<div class="vip-tips-p1"><div></div> 激活座駕</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP1及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">激活用戶擁有的座駕並在直播間展示。<br>注意：如果未開通VIP，即使擁有座駕也無法在直播間顯示。</div>
<div class="vip-tips-img"><img src="images/vip-tips1.png" alt=""></div>
<div class="vip-tips-jiao"></div>
</div>
<img src="images/t1-no.png" alt="">
<p>激活座駕</p>
</li>
<li>
<div class="vip-tips2">
<div class="vip-tips-p1"><div></div> 激活VIP等级</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP1及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期内，激活富豪等級對應的銘牌，并在用戶資料卡，平台榜單，空間等処展示。儅用戶在直播 間發言時，將展示對應的銘牌，同時昵稱顔色也相應發生變化。富豪等級不同，對應的銘牌不同。</div>
<div class="vip-tips-img"><img src="images/vip-tips2.png" alt=""></div>
<div class="vip-tips-jiao"></div>
</div>
<img src="images/t2-no.png" alt="">
<p>激活VIP等級</p>
</li>
<li>
<div class="vip-tips3">
<div class="vip-tips-p1"><div></div> 頭像掛件</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP11及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期內，在直播間內顯示主播特別的頭像框</div>
<div class="vip-tips-img"><img src="images/vip-tips3.png" alt=""></div>
<div class="vip-tips-jiao"></div>
</div>
<img src="images/t3-no.png" alt="">
<p>頭像掛件</p>
</li>
<li>
<div class="vip-tips4">
<div class="vip-tips-p1"><div></div> 尊貴名片</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP21及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期內，在直播間內的個人卡片上展示不同的描邊特效。</div>
<div class="vip-tips-img"><img src="images/vip-tips4.png" alt=""></div>
<div class="vip-tips-jiao"></div>
</div>
<img src="images/t4-no.png" alt="">
<p>尊貴名片</p>
</li>
<li>
<div class="vip-tips5">
<div class="vip-tips-p1"><div></div> 進場特效</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP31及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期內，進入直播間有專屬的進場特效。富豪等級不同，進場特效不同。</div>
<div class="vip-tips-img"><img src="images/vip-tips5.png" alt=""></div>
<div class="vip-tips-jiao"></div>
</div>
<img src="images/t5-no.png" alt="">
<p>進場特效</p>
</li>
<li>
<div class="vip-tips6">
<div class="vip-tips-p1"><div></div> 發言框底色</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP31及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期內，用戶發言有專屬的發言框底色，發言更炫酷，更引人注目哦<br>符號等級不同，底框顏色不同。</div>
<div class="vip-tips-img"><img src="images/vip-tips6.png" alt=""></div>
<div class="vip-tips-jiao"></div>
</div>
<img src="images/t6-no.png" alt="">
<p>發言框底色</p>
</li>
<li>
<div class="vip-tips7">
<div class="vip-tips-p1"><div></div> 進房間隱身</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP41及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期內，用戶發言有專屬的發言框底色，發言更炫酷，更引人注目哦<br>符號等級不同，底框顏色不同。</div>
<div class="vip-tips-img"><img src="images/vip-tips7.png" alt=""></div>
<div class="vip-tips-jiao"></div>
</div>
<img src="images/t7-no.png" alt="">
<p>進房間隱身</p>
<div class="stealth-box"><div></div><span>啟用</span></div>
</li>
<li>
<div class="vip-tips8">
<div class="vip-tips-p1"><div></div> 尊貴名片</div>
<div class="vip-tips-p2">獲取條件</div>
<div class="vip-tips-p3">VIP41及以上用戶</div>
<div class="vip-tips-p4">特權說明</div>
<div class="vip-tips-p5">在VIP有效期內，在直播間的用戶可以防止除主播外的其他人踢出/禁言。</div>
<div class="vip-tips-jiao"></div>
</div>
<img src="images/t8-no.png" alt="">
<p>防踢防禁言</p>
</li>
</ul>
<div class="vip-bottom-btn-box">
<p class="vip-bottom-btn-p1">連續包月: <span>100寶石</span>/月</p>
<p class="vip-bottom-btn-p2">首次開通贈送"熒光專屬"座駕7天</p>
<div class="vip-bottom-btn">開通會員</div>
</div>
</div>
</div>
</div>
</div>
<div style="display: none;" class="vip-tip-bg">
<div class="vip-tip-text1">
Footseen新老VIP會員權益大升級,老VIP會員特權全面<span>增加,</span><br>
新用戶首次開通會員，額外贈送<span>XXXX座駕7天，</span>VIP開通價格<span>保持不變,</span><br>
<span>全新VIP等級特權，只為彰顯您獨特最貴地位~</span><br>
還等什麼，趕快升級體驗一下吧。
</div>
<div class="vip-tip-text2">
<h2>如何解鎖VIP特權</h2>
<div>
<span>開通VIP會員是享有VIP特權的唯一途徑。</span>在"我的"--->"VIP特權"中點擊--->"开通VIP",完成購買後即自動开通VIP會員。<br>
開通VIP會員後，將根據<span>用戶的VIP等級</span>享有對應的VIP特權。<span class="vip-back">查看VIP特权>></span><br>
开通VIP后，如果VIP等级增加，将<span>自动解锁</span>更高等级的VIP特权。
</div>
</div>
<div class="vip-tips-content"></div>
<img class="vip-bottom" src="images/vip-bottom.png" alt="">
</div>
</div>
<div class="login-content">
</div>
<div class="vip-layer">
<div class="vip-layer-top">開通會員</div>
<div class="vip-layer-box-content">
<div class="vip-layer-box vip-layer-box1"><span class="vip-layer-box-span1">連續包月</span><span class="vip-layer-box-span2"><img src="images/diamond.png">30</span></div>
<div class="vip-layer-box vip-layer-box2"><span class="vip-layer-box-span1">一個月</span><span class="vip-layer-box-span2"><img src="images/diamond.png">30</span></div>
<div class="vip-layer-box vip-layer-box3"><span class="vip-layer-box-span1">兩個月</span><span class="vip-layer-box-span2"><img src="images/diamond.png">60</span></div>
<div class="vip-layer-box vip-layer-box4"><span class="vip-layer-box-span1">三個月</span><span class="vip-layer-box-span2"><img src="images/diamond.png">90</span></div>
</div>
<p class="vip-layer-tips">開通VIP后，將按照VIP等級享受對應特權</p>
<div class="vip-layer-btn">開通會員</div>
</div>
</body>
<script src="../lib/jquery-3.1.1.min.js"></script>
<script src="../layer-v3.1.0/layer/layer.js"></script>
<script src="../lib/default.js?v='2022072001'"></script>
<script src="../lib/login.js?v=2022072101"></script>
<script src="../lib/default.js?v='2022071303'"></script>
<script src="../lib/login.js?v=2022071901"></script>
<script src="../lib/qrcode.min.js"></script>
<script>
$(function(){
if(localStorage.token==undefined){
window.location.href='../index.html'
}
var openVip=true;
loginGo()
$(".vip-question").on("click",function(){
$(".vip-m").hide()
$(".vip-tip-bg").fadeIn(350)
})
$(".vip-back").on("click",function(){
$(".vip-tip-bg").hide()
$(".vip-m").fadeIn(350)
})
$.ajax({
url:$ip+'vip/queryVipInfo',
data:{
uid:localStorage.uid,
token:localStorage.token,
pageID:localStorage.canvasCode
},
success:function(data){
console.log('开通vip情况',data)
$(".vip-top-card-face").attr("src","https://zhibocdn.yabolive.net/comm"+data.vipInfo.face+"")
if($(".vip-top-card-face").attr("src")=='https://zhibocdn.yabolive.net/comm/user/boy.png')$(".vip-top-card-face").attr("src","http://test.ybact.ishuaji.cn/active2022/footseen/images/boy.png")
$(".vip-top-card-p1").text($(".login-more-top-p1").text())
$(".vip-level").text('VIP'+data.vipInfo.level+'')
$(".vip-level2").text('VIP'+(data.vipInfo.level+1)+'')
var barWidth=Math.floor((data.vipInfo.exp/(data.vipInfo.exp+data.vipInfo.nextLevelExp))*100)
$(".vip-bar-box div").css("width",barWidth+"%")
$(".vip-content-box2").html('當前等級:<span>VIP'+data.vipInfo.level+'</span>，再送<span>'+data.vipInfo.nextLevelExp+'</span>寶石即可升級為VIP'+(data.vipInfo.level+1)+'')
if(data.vipInfo.isVip==0){
$(".vip-top-card-p3").show()
}
if(data.vipInfo.isVip==1){
$(".vip-top-card-p3").hide()
$(".vip-top-card-p2").show().text('有效期至 '+timeGet(data.vipInfo.failureTime)[0]+'-'+timeGet(data.vipInfo.failureTime)[1]+'-'+timeGet(data.vipInfo.failureTime)[2]+'')
$(".vip-frame span").text(data.vipInfo.level)
$(".vip-frame").addClass("vip-frame"+(data.vipInfo.privileges.length-1)+"")
// $(".vip-bottom-ul li").eq(0).children("img").attr("src","images/t1.png")
// $(".vip-bottom-ul li").eq(1).children("img").attr("src","images/t2.png")
// $(".vip-bottom-ul li").eq(2).children("img").attr("src","images/t3.png")
}
$(".vip-icon").attr("src","images/i"+data.vipInfo.privileges.length+".png")
$(".left-vip-ul li").eq(data.vipInfo.privileges.length-1).addClass("card-click")
var levelNum=data.vipInfo.privileges[data.vipInfo.privileges.length-1]
if(data.vipInfo.privileges.length>4){
$(".stealth-box").show()
if(data.vipInfo.isHide==0){
$(".stealth-box").addClass("stealth-box2").attr("data-type","2")
$(".stealth-box span").text("關閉")
}else{
$(".stealth-box").removeClass("stealth-box2").attr("data-type","1")
$(".stealth-box span").text("開啟")
}
}
$(".stealth-box").unbind("click").on("click",function(){
var _self=$(this)
$.ajax({
url:$ip+'vip/setUserHide',
data:{
uid:localStorage.uid,
token:localStorage.token,
pageID:localStorage.canvasCode,
hide:_self.attr("data-type")
},
success:function(data){
console.log("設置用戶隱身狀態",data)
if(data.code!=1){
layer.msg(data.msg)
return;
}
if(_self.attr("data-type")==2){
$(".stealth-box").removeClass("stealth-box2").attr("data-type","1")
$(".stealth-box span").text("開啟")
}else{
$(".stealth-box").addClass("stealth-box2").attr("data-type","2")
$(".stealth-box span").text("關閉")
}
}
})
})
if(levelNum==1){
for(var i=0;i<2;i++){
$(".vip-bottom-ul li").eq(i).children("img").attr("src","images/t"+(i+1)+".png")
$(".vip-bottom-ul li").eq(i).children("p").css("color","#5B4022")
}
}
else if(levelNum==2){
for(var i=0;i<3;i++){
$(".vip-bottom-ul li").eq(i).children("img").attr("src","images/t"+(i+1)+".png")
$(".vip-bottom-ul li").eq(i).children("p").css("color","#5B4022")
}
}
else if(levelNum==3){
for(var i=0;i<4;i++){
$(".vip-bottom-ul li").eq(i).children("img").attr("src","images/t"+(i+1)+".png")
$(".vip-bottom-ul li").eq(i).children("p").css("color","#5B4022")
}
}
else if(levelNum==4){
for(var i=0;i<6;i++){
$(".vip-bottom-ul li").eq(i).children("img").attr("src","images/t"+(i+1)+".png")
$(".vip-bottom-ul li").eq(i).children("p").css("color","#5B4022")
}
}
else if(levelNum>4){
for(var i=0;i<8;i++){
$(".vip-bottom-ul li").eq(i).children("img").attr("src","images/t"+(i+1)+".png")
$(".vip-bottom-ul li").eq(i).children("p").css("color","#5B4022")
}
}
//左邊按鈕
$(".left-vip-ul li").unbind("click").on("click",function(){
var _self=$(this)
$(".vip-frame").removeClass("vip-frame0 vip-frame1 vip-frame2 vip-frame3 vip-frame4 vip-frame5 vip-frame6 vip-frame7")
$(".vip-frame").addClass("vip-frame"+(_self.attr("data-type2")-1)+"")
$(".vip-icon").attr("src","images/i"+_self.attr("data-type2")+".png")
$(".left-vip-ul li").removeClass("card-click")
_self.addClass("card-click")
if(_self.attr("data-type2")<5){
$(".stealth-box").hide()
}else $(".stealth-box").show()
if(data.vipInfo.level<_self.attr('data-type')){
$(".vip-bottom-btn").css("background","#999999").css("color","#FAFAFA").text("VIP"+_self.attr('data-type')+"可開通")
openVip=false
}else{
$(".vip-bottom-btn").css("background","#E62E74").css("color","#fff").text("開通會員")
openVip=true
}
for(var i=0;i<8;i++){
$(".vip-bottom-ul li").eq(i).children("img").attr("src","images/t"+(i+1)+"-no.png")
$(".vip-bottom-ul li").eq(i).children("p").css("color","#999999")
}
var levelNum=_self.attr("data-type2")
if(levelNum==1){
for(var i=0;i<2;i++){
$(".vip-bottom-ul li").eq(i).children("img").attr("src","images/t"+(i+1)+".png")
$(".vip-bottom-ul li").eq(i).children("p").css("color","#5B4022")
}
}
else if(levelNum==2){
for(var i=0;i<3;i++){
$(".vip-bottom-ul li").eq(i).children("img").attr("src","images/t"+(i+1)+".png")
$(".vip-bottom-ul li").eq(i).children("p").css("color","#5B4022")
}
}
else if(levelNum==3){
for(var i=0;i<4;i++){
$(".vip-bottom-ul li").eq(i).children("img").attr("src","images/t"+(i+1)+".png")
$(".vip-bottom-ul li").eq(i).children("p").css("color","#5B4022")
}
}
else if(levelNum==4){
for(var i=0;i<6;i++){
$(".vip-bottom-ul li").eq(i).children("img").attr("src","images/t"+(i+1)+".png")
$(".vip-bottom-ul li").eq(i).children("p").css("color","#5B4022")
}
}
else if(levelNum>4){
for(var i=0;i<8;i++){
$(".vip-bottom-ul li").eq(i).children("img").attr("src","images/t"+(i+1)+".png")
$(".vip-bottom-ul li").eq(i).children("p").css("color","#5B4022")
}
}
})
}
})
$(".vip-bottom-btn").on("click",function(){
if(openVip==false){
return;
}
VipOrder()
layer.open({
type: 1,
title: false,
shadeClose: true,
skin: "yourclass5",
area: ["430px", "500px"],
content: $(".vip-layer"),
end: function () {
$(".layui-layer-shade").hide()
layer.closeAll()
}
})
})
function VipOrder(){
$.ajax({
url:$ip+'vip/queryVipOrder',
data:{
uid:localStorage.uid,
token:localStorage.token,
pageID:localStorage.canvasCode
},
success:function(data){
console.log('獲取vip套餐',data)
var html=[];
var myClickData;
for(var i=0;i<data.vipOrderList.length;i++){
var list=data.vipOrderList[i];
if(data.cancelMonthly==1&&i==0){
html+='<div data-type2="1" data-type='+i+' class="vip-layer-box vip-layer-box'+(i+1)+'">';
html+='<span class="vip-layer-box-span1">'+list.textDescription+'<span style="color:#E62E74">(已開通)</span></span>';
html+='<span class="vip-layer-box-span2"><img src="images/diamond.png">'+list.price+'</span>';
html+='</div>'
continue;
}
html+='<div data-type='+i+' class="vip-layer-box vip-layer-box'+(i+1)+'">';
html+='<span class="vip-layer-box-span1">'+list.textDescription+'</span>';
html+='<span class="vip-layer-box-span2"><img src="images/diamond.png">'+list.price+'</span>';
html+='</div>'
}
$(".vip-layer-box-content").html(html);
buyType=1
$(".vip-layer-box").unbind("click").on("click",function(){
var _self=$(this)
myClickData=data.vipOrderList[_self.attr("data-type")]
$(".vip-layer-box").removeClass("vip-layer-box-click")
$(_self).addClass("vip-layer-box-click")
if(_self.attr("data-type2")==1){
$(".vip-layer-btn").text("取消包月")
buyType=2
}else{
$(".vip-layer-btn").text("開通會員")
buyType=1
}
})
$(".vip-layer-btn").unbind("click").on("click",function(){
$.ajax({
url:$ip+'vip/buyVip',
data:{
uid:localStorage.uid,
token:localStorage.token,
orderId:myClickData.vipoid,
consumeType:buyType,
pageID:localStorage.canvasCode
},
success:function(data){
console.log('開通VIP',data)
if(data.code==1){
if(buyType==1)layer.msg('開通成功')
else layer.msg('已關閉連續包月')
setTimeout(function(){
window.location.reload()
},1000);
}else{
layer.msg(data.msg)
}
}
})
})
}
})
}
})
</script>
</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 sign in to comment