parent
fbdca13ce8
commit
662cc1ab83
|
@ -18,6 +18,7 @@
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
/*全屏抖动*/
|
||||||
@keyframes scale-body{
|
@keyframes scale-body{
|
||||||
0%{
|
0%{
|
||||||
transform: scale(1);
|
transform: scale(1);
|
||||||
|
@ -441,72 +442,80 @@
|
||||||
@keyframes scale-left{
|
@keyframes scale-left{
|
||||||
0{
|
0{
|
||||||
transform:scale(1,1);
|
transform:scale(1,1);
|
||||||
transform-origin:left 90%;
|
transform-origin:0rem 18.75rem;
|
||||||
}
|
}
|
||||||
10%{
|
1%{
|
||||||
transform:scale(1.4,1.4);
|
transform:scale(1.4,1.4);
|
||||||
transform-origin:left 90%;
|
transform-origin:0rem 18.75rem;
|
||||||
}
|
}
|
||||||
90%{
|
40%{
|
||||||
transform:scale(1.4,1.4);
|
transform:scale(1.4,1.4);
|
||||||
transform-origin:right 90%;
|
transform-origin:100% 18.75rem;
|
||||||
|
}
|
||||||
|
70%{
|
||||||
|
transform-origin:50% 50%;
|
||||||
|
transform: scale(0.9,0.9);
|
||||||
}
|
}
|
||||||
100%{
|
100%{
|
||||||
transform-origin:right 90%;
|
transform-origin:50% 50%;
|
||||||
transform:scale(1,1);
|
transform: scale(1,1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@keyframes scale-right{
|
@keyframes scale-right{
|
||||||
0{
|
0{
|
||||||
transform:scale(1,1);
|
transform:scale(1,1);
|
||||||
transform-origin:right 90%;
|
transform-origin:100% 18.75rem;
|
||||||
}
|
}
|
||||||
10%{
|
1%{
|
||||||
transform:scale(1.4,1.4);
|
transform:scale(1.4,1.4);
|
||||||
transform-origin:right 90%;
|
transform-origin:100% 18.75rem;
|
||||||
}
|
}
|
||||||
90%{
|
90%{
|
||||||
transform:scale(1.4,1.4);
|
transform:scale(1.4,1.4);
|
||||||
transform-origin:left 90%;
|
transform-origin:0 18.75rem;
|
||||||
}
|
}
|
||||||
100%{
|
100%{
|
||||||
transform-origin:left 90%;
|
transform-origin:0 18.75rem;
|
||||||
transform:scale(1,1);
|
transform:scale(1,1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@keyframes scale-bottom-right{
|
@keyframes scale-bottom-right{
|
||||||
0{
|
0{
|
||||||
transform:scale(1,1);
|
transform:scale(1,1);
|
||||||
transform-origin:right 200%;
|
transform-origin:100% 43.75rem;
|
||||||
}
|
}
|
||||||
10%{
|
1%{
|
||||||
transform:scale(1.4,1.4);
|
transform:scale(1.4,1.4);
|
||||||
transform-origin:right 200%;
|
transform-origin:100% 43.75rem;
|
||||||
}
|
}
|
||||||
90%{
|
40%{
|
||||||
transform:scale(1.4,1.4);
|
transform:scale(1.4,1.4);
|
||||||
transform-origin:left 200%;
|
transform-origin:0 43.75rem;
|
||||||
|
}
|
||||||
|
70%{
|
||||||
|
transform-origin:50% 50%;
|
||||||
|
transform: scale(0.9,0.9);
|
||||||
}
|
}
|
||||||
100%{
|
100%{
|
||||||
transform-origin:left 200%;
|
transform-origin:50% 50%;
|
||||||
transform:scale(1,1);
|
transform: scale(1,1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@keyframes scale-bottom-left{
|
@keyframes scale-bottom-left{
|
||||||
0{
|
0{
|
||||||
transform:scale(1,1);
|
transform:scale(1,1);
|
||||||
transform-origin:left 200%;
|
transform-origin:0 43.75rem;
|
||||||
}
|
}
|
||||||
10%{
|
1%{
|
||||||
transform:scale(1.4,1.4);
|
transform:scale(1.4,1.4);
|
||||||
transform-origin:left 200%;
|
transform-origin:0 43.75rem;
|
||||||
}
|
}
|
||||||
90%{
|
90%{
|
||||||
transform:scale(1.4,1.4);
|
transform:scale(1.4,1.4);
|
||||||
transform-origin:right 200%;
|
transform-origin:100% 43.75rem;
|
||||||
}
|
}
|
||||||
100%{
|
100%{
|
||||||
transform-origin:right 200%;
|
transform-origin:100% 43.75rem;
|
||||||
transform:scale(1,1);
|
transform:scale(1,1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -139,13 +139,13 @@ input, textarea, select {
|
||||||
}
|
}
|
||||||
/*镜头拉近*/
|
/*镜头拉近*/
|
||||||
.scale-left{
|
.scale-left{
|
||||||
animation: scale-left 8s linear normal;
|
animation: scale-left 12s linear normal;
|
||||||
}
|
}
|
||||||
.scale-right{
|
.scale-right{
|
||||||
animation: scale-right 8s linear normal;
|
animation: scale-right 8s linear normal;
|
||||||
}
|
}
|
||||||
.scale-bottom-right{
|
.scale-bottom-right{
|
||||||
animation: scale-bottom-right 8s linear normal;
|
animation: scale-bottom-right 12s linear normal;
|
||||||
}
|
}
|
||||||
.scale-bottom-left{
|
.scale-bottom-left{
|
||||||
animation: scale-bottom-left 8s linear normal;
|
animation: scale-bottom-left 8s linear normal;
|
||||||
|
@ -161,6 +161,12 @@ body{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
.ground-bg{
|
||||||
|
background: url(../image/img_0x.png) no-repeat;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
/* transform: scale(0.9,0.9); */
|
||||||
|
}
|
||||||
.Lighting{
|
.Lighting{
|
||||||
position: fixed;
|
position: fixed;
|
||||||
z-index: 99;
|
z-index: 99;
|
||||||
|
|
13
dancing.html
13
dancing.html
|
@ -8,10 +8,12 @@
|
||||||
<link rel="stylesheet" type="text/css" href="css/style-jq.css" />
|
<link rel="stylesheet" type="text/css" href="css/style-jq.css" />
|
||||||
<script src="js/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script>
|
<script src="js/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script>
|
||||||
<script src="./js/custom.js" type="text/javascript" charset="utf-8"></script>
|
<script src="./js/custom.js" type="text/javascript" charset="utf-8"></script>
|
||||||
<body class=""><!--增加 class=" scale-right" 可使用从右向左镜头效果scale-left scale-bottom-left scale-bottom-right -->
|
<body>
|
||||||
<!--灯光-->
|
<!--灯光-->
|
||||||
<div class="Lighting">
|
<div class="Lighting">
|
||||||
</div>
|
</div>
|
||||||
|
<!--增加 class=" scale-right" 可使用从右向左镜头效果scale-left scale-bottom-left scale-bottom-right -->
|
||||||
|
<div class=" scale-bottom-right ground-bg">
|
||||||
<!--地面灯光-->
|
<!--地面灯光-->
|
||||||
<div class="ground-light">
|
<div class="ground-light">
|
||||||
<div class="ground-animate"></div>
|
<div class="ground-animate"></div>
|
||||||
|
@ -22,7 +24,7 @@
|
||||||
<video id="mousedown" loop autoplay muted src="image/vd.mp4" ></video>
|
<video id="mousedown" loop autoplay muted src="image/vd.mp4" ></video>
|
||||||
</div>
|
</div>
|
||||||
<!--音乐-->
|
<!--音乐-->
|
||||||
<audio controls autoplay muted style="z-index: 999; position: fixed;display: none;">
|
<audio controls autoplay loop muted style="z-index: 999; position: fixed;display: none;">
|
||||||
<source src="muz/829094.mp3" type="audio/mpeg">
|
<source src="muz/829094.mp3" type="audio/mpeg">
|
||||||
</audio>
|
</audio>
|
||||||
<!--点击播放音乐-->
|
<!--点击播放音乐-->
|
||||||
|
@ -40,7 +42,7 @@
|
||||||
<div class="speak speak-pink">
|
<div class="speak speak-pink">
|
||||||
一起:起来嗨!
|
一起:起来嗨!
|
||||||
</div>
|
</div>
|
||||||
<div class="leading-dancer dancing-right">
|
<div class="leading-dancer dancing-Wobble-right">
|
||||||
</div>
|
</div>
|
||||||
<div class="table">
|
<div class="table">
|
||||||
<img src="image/icon_01.png" />
|
<img src="image/icon_01.png" />
|
||||||
|
@ -51,7 +53,7 @@
|
||||||
<!--大航海介绍-->
|
<!--大航海介绍-->
|
||||||
<div class="types">
|
<div class="types">
|
||||||
<!-- <div class="name">
|
<!-- <div class="name">
|
||||||
<p>送任意电池可获得荧光棒!<br />
大航海排名前三可成为领舞!<br />
领舞特权:切歌,镜头,统一动作”跳跃,旋转,向左,向右”,
一起喊“任意文字”,一起嗨:会下纸片
|
<p>送任意电池可获得荧光棒!<br />
大航海排名前三可成为领舞!<br />
领舞特权:切歌,镜头,统一动作”跳跃,旋转,向左,向右,向左抖腿,向右抖腿”,
一起喊“任意文字”
|
||||||
</p>
|
</p>
|
||||||
</div> -->
|
</div> -->
|
||||||
<div class="list">
|
<div class="list">
|
||||||
|
@ -136,8 +138,9 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!--舞池 end-->
|
<!--舞池 end-->
|
||||||
|
|
||||||
|
</div>
|
||||||
<!--小纸片氛围js-->
|
<!--小纸片氛围js-->
|
||||||
<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
|
<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
|
||||||
<!--小纸片氛围js-->
|
<!--小纸片氛围js-->
|
||||||
|
|
BIN
image/img_0x.png
BIN
image/img_0x.png
Binary file not shown.
Before Width: | Height: | Size: 469 KiB After Width: | Height: | Size: 1.5 MiB |
|
@ -102,11 +102,11 @@ $(function(){
|
||||||
var sayIndex = Math.floor(Math.random()*sayArr.length);
|
var sayIndex = Math.floor(Math.random()*sayArr.length);
|
||||||
var actionIndex = Math.floor(Math.random()*actionArr.length);
|
var actionIndex = Math.floor(Math.random()*actionArr.length);
|
||||||
num++;
|
num++;
|
||||||
if(num==300){
|
if(num==200){
|
||||||
clearInterval(timer);
|
clearInterval(timer);
|
||||||
} else {
|
} else {
|
||||||
peopleObj(nameArr[nameIndex],sayArr[sayIndex],actionArr[actionIndex]);
|
peopleObj(nameArr[nameIndex],sayArr[sayIndex],actionArr[actionIndex]);
|
||||||
}
|
}
|
||||||
},000)
|
},0)
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
Loading…
Reference in New Issue