chen
/
squareDancing
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

修改背景装饰样式

master
cp 2021-11-26 15:01:54 +08:00
parent 08c7a7dbbc
commit 90f0f40207
5 changed files with 11 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
css/animate.css vendored
View File

@ -488,14 +488,10 @@
transform:scale(1.4,1.4); transform:scale(1.4,1.4);
transform-origin:100% 43.75rem; transform-origin:100% 43.75rem;
} }
40%{ 90%{
transform:scale(1.4,1.4); transform:scale(1.4,1.4);
transform-origin:0 43.75rem; transform-origin:0 43.75rem;
} }
70%{
transform-origin:50% 50%;
transform: scale(0.9,0.9);
}
100%{ 100%{
transform-origin:50% 50%; transform-origin:50% 50%;
transform: scale(1,1); transform: scale(1,1);

16
css/style.css
View File

@ -129,17 +129,17 @@ input, textarea, select {
body{ body{
width: 100%; width: 100%;
height: 100%; height: 100%;
background: url(../image/img_01.png) no-repeat;
overflow: hidden; overflow: hidden;
animation: scale-body .6s linear infinite;
top:0px; top:0px;
position: absolute; animation: scale-body .6s linear infinite;
} }
.ground-bg{ .ground-bg{
background: url(../image/img_0x.png) no-repeat; position: absolute;
background: url(../image/img_01.png) no-repeat;
/* background: url(../image/img_0x.png) no-repeat; */
width: 100%; width: 100%;
height: 100%; height: 110%;
/* transform: scale(0.9,0.9); */ /* transform: scale(0.9,0.9); */
} }
.Lighting{ .Lighting{
@ -156,7 +156,7 @@ body{
.ground-light{ .ground-light{
z-index: 1; z-index: 1;
position: fixed; position: fixed;
top:-100px; top:-34px;
left: 50%; left: 50%;
width:1440px; width:1440px;
height: 1440px; height: 1440px;
@ -283,8 +283,8 @@ body{
/*舞池*/ /*舞池*/
.dance-floor-box{ .dance-floor-box{
position: fixed; position: fixed;
left: 150px; left: 220px;
width:calc(100% - 300px); width:calc(100% - 440px);
height: calc(100vh - 410px); height: calc(100vh - 410px);
z-index: 9999; z-index: 9999;
} }

3
dancing.html
View File

@ -9,11 +9,12 @@
<script src="./js/custom.js" type="text/javascript" charset="utf-8"></script> <script src="./js/custom.js" type="text/javascript" charset="utf-8"></script>
<script src="./js/handle.js" type="text/javascript" charset="utf-8"></script> <script src="./js/handle.js" type="text/javascript" charset="utf-8"></script>
<body> <body>
<div class="ground-bg">
<!--灯光--> <!--灯光-->
<div class="Lighting"> <div class="Lighting">
</div> </div>
<!--增加 class=" scale-right" 可使用从右向左镜头效果scale-left scale-bottom-left scale-bottom-right --> <!--增加 class=" scale-right" 可使用从右向左镜头效果scale-left scale-bottom-left scale-bottom-right -->
<div class=" ground-bg">
<!--地面灯光--> <!--地面灯光-->
<div class="ground-light"> <div class="ground-light">
<div class="ground-animate"></div> <div class="ground-animate"></div>

BIN
image/img_01.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 318 KiB

After

Width:  |  Height:  |  Size: 331 KiB

BIN
image/img_0x.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 369 KiB

After

Width:  |  Height:  |  Size: 370 KiB