diff --git a/src/pages/index/components/chat/ChatTopNavBar/index.vue b/src/pages/index/components/chat/ChatTopNavBar/index.vue
index 890337a..e48eb38 100644
--- a/src/pages/index/components/chat/ChatTopNavBar/index.vue
+++ b/src/pages/index/components/chat/ChatTopNavBar/index.vue
@@ -5,13 +5,10 @@
-
+ :class="['ip w-32 h-32', { 'image-animated': show }]"
+ >
-
+
diff --git a/src/pages/index/components/chat/ChatTopWelcome/styles/index.scss b/src/pages/index/components/chat/ChatTopWelcome/styles/index.scss
index 7c8ba5c..2f3f752 100644
--- a/src/pages/index/components/chat/ChatTopWelcome/styles/index.scss
+++ b/src/pages/index/components/chat/ChatTopWelcome/styles/index.scss
@@ -3,8 +3,23 @@
}
.ip {
- flex: 0 0 123px;
- width: 123px;
- height: 166px;
- margin-top: -20px;
+ flex: 0 0 158px;
+ width: 158px;
+ height: 134px;
+ background-image: url("https://oss.nianxx.cn/mp/static/version_101/dh/dh.png");
+ background-repeat: no-repeat;
+ background-size: 158px auto;
+ background-position: 0 0;
+ animation: sprite-play 2s steps(40) infinite;
+}
+
+@keyframes sprite-play {
+ 0% {
+ background-position: 0 0;
+ }
+
+ 100% {
+ /* 40 帧 × 每帧高度约 139px,终点应为 -(40-1)*139 = -5421px */
+ background-position: 0 -5424px;
+ }
}