1、前门增加舞狮动画
This commit is contained in:
Wenzhe 2026-01-30 23:30:10 +08:00
parent de856a1372
commit bca7267c03
7 changed files with 26 additions and 0 deletions

View File

@ -200,6 +200,9 @@ onUnmounted(() => {
alt="新春祝福"
class="sq1-image"
/>
<!-- 舞狮动画 -->
<div class="lion-dance"></div>
</section>
</template>
@ -498,6 +501,29 @@ onUnmounted(() => {
to { opacity: 1; transform: translateY(0); }
}
/* ========== 舞狮动画(背景图切换) ========== */
.lion-dance {
position: absolute;
left: 0rpx;
top: 740rpx;
width: 425rpx;
height: 475rpx;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
animation: lionDance 0.9s infinite;
z-index: 25;
}
@keyframes lionDance {
0%, 16.66% { background-image: url('/static/animate/lion/lion1.png'); }
16.67%, 33.33% { background-image: url('/static/animate/lion/lion2.png'); }
33.34%, 50% { background-image: url('/static/animate/lion/lion3.png'); }
50.01%, 66.66% { background-image: url('/static/animate/lion/lion4.png'); }
66.67%, 83.33% { background-image: url('/static/animate/lion/lion5.png'); }
83.34%, 100% { background-image: url('/static/animate/lion/lion6.png'); }
}
/* 响应式设计 */
@media (max-width: 640px) {
.fu-word {

Binary file not shown.

After

Width:  |  Height:  |  Size: 175 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 186 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 179 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 198 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 190 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 176 KiB