增加舰长专属巨型光剑

master
cp 2021-11-29 19:16:23 +08:00
parent 6c99084bd7
commit 15041d3fad
4 changed files with 91 additions and 14 deletions

53
css/animate.css vendored
View File

@ -537,18 +537,59 @@
transform-origin:22px 60px;
}
}
@keyframes stickgo{
0{
@keyframes Wobble-big{
from{
transform:rotate(0deg);
top:0px;
transform-origin:36px 139px;
}
25%{
transform:rotate(30deg);
transform-origin:36px 139px;
}
50%{
transform:rotate(1440deg);
top: -150px;
transform:rotate(0deg);
transform-origin:36px 139px;
}
75%{
transform:rotate(-30deg);
transform-origin:36px 139px;
}
100%{
transform:rotate(0deg);
top:0px;
transform-origin:36px 139px;
}
}
@keyframes Wobble-big-tow{
from{
transform:rotate(0deg);
transform-origin:43px 120px;
}
25%{
transform:rotate(30deg);
transform-origin:43px 120px;
}
50%{
transform:rotate(0deg);
transform-origin:43px 120px;
}
75%{
transform:rotate(-30deg);
transform-origin:43px 120px;
}
100%{
transform:rotate(0deg);
transform-origin:43px 120px;
}
}
@keyframes stickgo{
0{
transform:translateY(0) rotate(0deg);
}
50%{
transform:translateY(-150px) rotate(1440deg);
}
100%{
transform:translateY(0) rotate(0deg);
}
}
/*烟花*/

View File

@ -356,6 +356,12 @@ body{
.stick-swing{
animation: Wobble 2s linear infinite;
}
.stick-swing-big{
animation: Wobble-big 2s linear infinite;
}
.stick-swing-big-tow {
animation: Wobble-big-tow 2s linear infinite;
}
.stick-go{
animation: stickgo 2s linear infinite;
}
@ -402,10 +408,42 @@ body{
top: -3px;
right: -15px;
}
.leading-dancer .stick{
top: 3px;
right: -30px;
/*大荧光棒*/
.stick.stick-swing-big,.stick.stick-swing-big-tow{
background-size: 114px 162px;
background-repeat: no-repeat;
width: 114px ;
height: 162px;
}
.leading-dancer .stick{
top: -70px;
right: -70px;
}
.dance-people .people-img01 .stick.stick-swing-big-tow{
top: -43px;
right: -40px;
}
.dance-people .people-img02 .stick.stick-swing-big-tow{
top: -61px;
right: 0px;
}
.dance-people .people-img03 .stick.stick-swing-big-tow{
top: -67px;
right: -57px;
}
.dance-people .people-img04 .stick.stick-swing-big-tow{
top: -57px;
right: -50px;
}
.dance-people .people-img05 .stick.stick-swing-big-tow{
top: -68px;
right: -55px;
}
.dance-people .people-img06 .stick.stick-swing-big-tow{
top: -55px;
right: -10px;
}
/*大荧光棒*/
.paper-canvas{
width: 100%;
height: 100%;

View File

@ -41,7 +41,7 @@
<div class="leading">
<div class="speak speak-pink"></div>
<div class="leading-dancer dancing-wobble-right">
<div class="stick stick-06 stick-swing"></div>
<div class="stick stick-06 stick-swing-big"></div>
</div>
<div class="table">
<img src="image/icon_01.png" />
@ -60,8 +60,6 @@
</div>
</div>
</div>
</div>
<!--小纸片氛围js-->
<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
<!--小纸片氛围js-->

View File

@ -174,11 +174,11 @@ function peopleObj(name,uid,say,action,active_time){
<div id="${comment.uid}" data-time="${comment.active_time}" class="dance-people data${peopleId}" style="top: ${comment.top}; left: ${comment.left};">
<div class="speak ">${comment.say}</div>
<div class="people-img ${comment.peopleImg} ${comment.dancin}">
<div class="stick stick-swing ${comment.ying_guang}"></div>
<div class="stick stick-swing stick-swing-big-tow ${comment.ying_guang}"></div>
<div class="people-name ">${comment.name}</div>
</div>
</div>`
});
});//如果是舰长需要加上stick-swing-big-tow
$('.dance-floor').prepend(yspHtml);
moveEv(uid);
// 随机舞