Browse Source

修改动图

master
Email 3 years ago
parent
commit
9b6b92e7bf
23 changed files with 59 additions and 25 deletions
  1. 8
      begin.html
  2. 12
      css/game1.css
  3. 8
      css/game2.css
  4. 6
      css/game4.css
  5. 15
      css/game5.css
  6. 4
      game1.html
  7. 12
      game2.html
  8. 4
      game3.html
  9. 2
      game4.html
  10. 11
      game5.html
  11. BIN
      img/game1/bgm.gif
  12. BIN
      img/game1/icon2.png
  13. BIN
      img/game1/lin2.png
  14. BIN
      img/game1/successBgm.gif
  15. BIN
      img/game2/game2Bgm.gif
  16. BIN
      img/game2/successBgm.gif
  17. BIN
      img/game3/bgm.gif
  18. BIN
      img/game3/successBgm.gif
  19. BIN
      img/game4/successBgm.gif
  20. BIN
      img/game5/allWin.png
  21. BIN
      img/game5/bgm.gif
  22. BIN
      img/game5/successBgm.gif
  23. 2
      index.html

8
begin.html

@ -154,7 +154,7 @@
</ul>
</div>
<div class="countDown">
<text>10</text>(s)
<text>5</text>(s)
</div>
</div>
</div>
@ -166,6 +166,8 @@
<div class="mask"></div>
</div>
<script type="text/javascript">
var allTime = 0;
var timeSet ;
$('.close').click(function(){
$('.mask').fadeOut();
$('.guizBox').fadeOut()
@ -179,6 +181,10 @@
$('.begin').fadeOut(100)
$('.loading').fadeOut(100)
$('#game1').fadeIn(500)
timeSet= setInterval(function(){
allTime++
},1000)
})
//倒计时

12
css/game1.css

@ -53,8 +53,8 @@
width: 1rem;
height: 1rem;
position: absolute;
left: 0;
top: 0;
/*left: 0;
top: 0;*/
/*background: #000000;
opacity: .5;*/
}
@ -65,10 +65,10 @@
}
.game1Index .clickIcon li.click2 {
top: 16%;
left: 46%;
width: .5rem;
height: .5rem;
bottom: 23%;
left: 40%;
width: 1.5rem;
height: 1rem;
}
.game1Index .clickIcon img {

8
css/game2.css

@ -45,7 +45,7 @@
}
.game2Index .clickIcon li.click1{
top: 6%;
right: 52%;
left: 32%;
background-size: 100% 100%;
}
.game2Index .clickIcon li img{
@ -53,9 +53,11 @@
display: none;
}
.game2Index .clickIcon li.click2{
top: 9%;
right:67%;
top: 34%;
right: 66%;
background-size: 100% 100%;
/*background: rgba(0,0,0,.5);*/
width: 1.5rem;
}
.game2Index .clickIcon li.click3{
top: 78%;

6
css/game4.css

@ -5,6 +5,12 @@
.snowList {
/*display: none;*/
width: 100%;
height: 100%;
overflow: hidden;
position: absolute;
left: 0;
top: 0;
}
.snow {
font-family: icon;

15
css/game5.css

@ -221,4 +221,17 @@
align-items: flex-end;
display: none;
z-index: 99;
}
}
/*历时时间*/
.game5Index .timeNum{
font-size: .72rem;
font-weight: bold;
font-stretch: normal;
/* letter-spacing: 5px; */
color: #ffffff;
-webkit-text-stroke: 2px #306169;
position: absolute;
left: 61.5%;
top: 56%;
transform: translate(-50%, -50%);
}

4
game1.html

@ -1,8 +1,8 @@
<link rel="stylesheet" type="text/css" href="css/game1.css" />
<div class="game1Index">
<p class="bgm">
<img src="img/game1/bgm.png" />
<img src="img/game1/successBgm.png" />
<img src="img/game1/bgm.gif" />
<img src="img/game1/successBgm.gif" />
</p>
<div class="box_wrap">

12
game2.html

@ -1,8 +1,8 @@
<link rel="stylesheet" type="text/css" href="css/game2.css" />
<div class="game2Index">
<p class="bgm">
<img src="img/game2/game2Bgm.png" />
<img src="img/game2/successBgm.png"/>
<img src="img/game2/game2Bgm.gif" />
<img src="img/game2/successBgm.gif"/>
</p>
<div class="box_wrap">
<ul class="imgList">
@ -113,8 +113,8 @@
$('.game2Index .click1').click(function() {
$('.game2Index .click1 img').css('display','block')
$('.game2Index .click1').animate({
'top': '0.5%',
"right": '21%',
'top': '1.5%',
"left": '71%',
'transform': 'translate(-50%,-50%)'
}, 1000)
// setTimeout(function() {
@ -131,8 +131,8 @@
$('.game2Index .click2').click(function() {
$('.game2Index .click2 img').css('display','block')
$('.game2Index .click2').animate({
'top': '4%',
"right": '12%',
'top': '3%',
"right": '8%',
'transform': 'translate(-50%,-50%)'
}, 1000)
// setTimeout(function() {

4
game3.html

@ -1,8 +1,8 @@
<link rel="stylesheet" type="text/css" href="css/game3.css" />
<div class="game3Index">
<p class="bgm">
<img src="img/game3/bgm.png" />
<img src="img/game3/successBgm.png" />
<img src="img/game3/bgm.gif" />
<img src="img/game3/successBgm.gif" />
</p>
<div class="box_wrap">
<ul class="imgList">

2
game4.html

@ -3,7 +3,7 @@
<div class="snowList"></div>
<p class="bgm">
<img src="img/game4/game4Bgm.png" />
<img src="img/game4/successBgm.png" />
<img src="img/game4/successBgm.gif" />
</p>
<div class="box_wrap">
<ul class="imgList">

11
game5.html

@ -1,8 +1,8 @@
<link rel="stylesheet" type="text/css" href="css/game5.css" />
<div class="game5Index">
<p class="bgm">
<img src="img/game5/bgm.png" />
<img src="img/game5/successBgm.png" />
<img src="img/game5/bgm.gif" />
<img src="img/game5/successBgm.gif" />
</p>
<div class="box_wrap">
<ul class="imgList">
@ -61,6 +61,7 @@
<div class="maskBgm"></div>
<!--下一关-->
<div class="successBox">
<p class="timeNum"></p>
<!--<div class="shut"><img src="img/close.png" /></div>-->
<!--<p class="above game5Above"><img src="img/aboveIcon.png" /></p>-->
<p class="next game5Next"><img src="img/game5/sure.png" /></p>
@ -132,6 +133,12 @@ var video5 = document.getElementById("video5");
})
function success5() {
if(num5.length == 3) {
if(allTime>999){
$('.timeNum').text('999 ')
}else{
$('.timeNum').text(allTime)
}
console.log('成功')
setTimeout(function() {
$('.game5Index p.bgm img').eq(0).animate({

BIN
img/game1/bgm.gif

Before After
Width: 1334  |  Height: 750  |  Size: 2.5 MiB

BIN
img/game1/icon2.png

Before After
Width: 92  |  Height: 66  |  Size: 6.9 KiB Width: 80  |  Height: 61  |  Size: 7.5 KiB

BIN
img/game1/lin2.png

Before After
Width: 92  |  Height: 66  |  Size: 6.9 KiB Width: 80  |  Height: 61  |  Size: 7.5 KiB

BIN
img/game1/successBgm.gif

Before After
Width: 1334  |  Height: 720  |  Size: 2.4 MiB

BIN
img/game2/game2Bgm.gif

Before After
Width: 1334  |  Height: 750  |  Size: 1.8 MiB

BIN
img/game2/successBgm.gif

Before After
Width: 1334  |  Height: 750  |  Size: 2.2 MiB

BIN
img/game3/bgm.gif

Before After
Width: 1334  |  Height: 750  |  Size: 549 KiB

BIN
img/game3/successBgm.gif

Before After
Width: 1334  |  Height: 750  |  Size: 1.8 MiB

BIN
img/game4/successBgm.gif

Before After
Width: 1334  |  Height: 750  |  Size: 859 KiB

BIN
img/game5/allWin.png

Before After
Width: 953  |  Height: 583  |  Size: 232 KiB Width: 923  |  Height: 646  |  Size: 209 KiB

BIN
img/game5/bgm.gif

Before After
Width: 1334  |  Height: 750  |  Size: 2.5 MiB

BIN
img/game5/successBgm.gif

Before After
Width: 1334  |  Height: 750  |  Size: 706 KiB

2
index.html

@ -93,7 +93,7 @@
$('.flex-center').fadeOut(10)
// $('.begin').fadeIn(100)
$('.load').attr('src', 'img/begin.png')
var num = 3;
var num = 5;
var timeDown = setInterval(function(){
console.log(num--)

Loading…
Cancel
Save