parent
d4e370182d
commit
96461e36a7
@ -1,96 +0,0 @@ |
||||
.model_wrap{ |
||||
width: 100%; |
||||
height: 100vh; |
||||
background-color: #000; |
||||
opacity: 0.5; |
||||
position: fixed; |
||||
top: 0; |
||||
display:none; |
||||
z-index:2001; |
||||
} |
||||
.unchoose{ |
||||
display: none; |
||||
} |
||||
.model-bg{ |
||||
width: 560px; |
||||
position: absolute; |
||||
top: 30%; |
||||
left: 60%; |
||||
color:#fff; |
||||
margin-left: -600px; |
||||
z-index:2002 ; |
||||
} |
||||
.content{ |
||||
font-size:20px; |
||||
} |
||||
.jump{ |
||||
cursor: pointer; |
||||
position:absolute; |
||||
width:80px; |
||||
font-size:16px; |
||||
color:coral; |
||||
padding: 10px 20px; |
||||
border-radius: 40px; |
||||
top:22%; |
||||
left:53%; |
||||
z-index: 2002; |
||||
text-align: center; |
||||
border: 2px solid coral; |
||||
transition: background-color .3s |
||||
} |
||||
.jump:hover{ |
||||
background-color: coral; |
||||
color:#fff; |
||||
} |
||||
.Previous{ |
||||
cursor: pointer; |
||||
width:100px; |
||||
text-align: center; |
||||
font-size:16px; |
||||
color:#1ecd97; |
||||
padding: 10px 20px; |
||||
border-radius: 40px; |
||||
margin-top: 20px; |
||||
border: 2px solid #1ecd97; |
||||
transition: background-color .3s |
||||
} |
||||
.Previous:hover{ |
||||
background-color: #1ecd97; |
||||
color:#fff; |
||||
} |
||||
.nextPage{ |
||||
cursor: pointer; |
||||
width: 100px; |
||||
font-size:16px; |
||||
color:#1ecd97; |
||||
padding: 10px 20px; |
||||
border-radius: 40px; |
||||
text-align: center; |
||||
margin-top:-46px; |
||||
margin-left:150px; |
||||
border: 2px solid #1ecd97; |
||||
transition: background-color .3s |
||||
} |
||||
.nextPage:hover{ |
||||
background-color: #1ecd97; |
||||
color:#fff; |
||||
} |
||||
.point1{ |
||||
width: 525px; |
||||
height:174px; |
||||
background:url("../img/prompt.png") no-repeat center/cover; |
||||
position:absolute; |
||||
left:-548px; |
||||
top:-110px; |
||||
} |
||||
.point2{ |
||||
width: 529px; |
||||
height:170px; |
||||
background:url("../img/prompt3.png") no-repeat center/cover; |
||||
position:absolute; |
||||
left:-548px; |
||||
top:17px; |
||||
} |
||||
.boo{ |
||||
border:2px solid #fff; |
||||
} |
@ -1,41 +0,0 @@ |
||||
$(function(){ |
||||
var arr=[0,1,3,5,6,7,8,12]; |
||||
$(".prompt").click(function(){ |
||||
$(".model_wrap").show(); |
||||
$(".model-bg").eq(0).removeClass("unchoose"); |
||||
$('.jump').removeClass('unchoose'); |
||||
$('#side-menu .av').eq(arr[0]).click().addClass('boo'); |
||||
}); |
||||
|
||||
$(".model-bg").each(function (i) { |
||||
let _that=$(this); |
||||
_that.find(".nextPage").click(function () { |
||||
console.log(i); |
||||
_that.addClass("unchoose"); |
||||
$(".model-bg").eq(i+1).removeClass("unchoose"); |
||||
$('#side-menu .av').eq(arr[i+1]).addClass('boo'); |
||||
$('#side-menu .av').eq(arr[i]).removeClass('boo'); |
||||
}); |
||||
_that.find(".Previous").click(function () { |
||||
console.log(i); |
||||
_that.addClass("unchoose"); |
||||
$(".model-bg").eq(i-1).removeClass("unchoose"); |
||||
$('#side-menu .av').eq(arr[i-1]).addClass('boo'); |
||||
$('#side-menu .av').eq(arr[i]).removeClass('boo'); |
||||
}); |
||||
}); |
||||
|
||||
$(".perfection").click(function () { |
||||
$(".jump").addClass('unchoose'); |
||||
$(".model_wrap").hide(); |
||||
}); |
||||
|
||||
$(".jump").click(function () { |
||||
$(this).addClass('unchoose'); |
||||
$(".model_wrap").hide(); |
||||
$(".model-bg").addClass("unchoose"); |
||||
$("#side-menu .av").each(function (i) { |
||||
console.log(i); |
||||
}) |
||||
}); |
||||
}); |
Loading…
Reference in new issue