feat: 手势动画：上下滑动，动画结束消失

src/App.vue

@@ -40,4 +40,32 @@ html,
   transition: transform 0.5s !important;
   transition-timing-function: cubic-bezier(0.75, 0, 0.24, 1);
 }
+@keyframes slideNhide {
+  0% {
+    opacity: 1;
+    transform: translateY(0);
+  }
+  15% {
+    transform: translateY(-100px);
+  }
+  30% {
+    transform: translateY(0);
+  }
+  45% {
+    transform: translateY(-100px);
+  }
+  60% {
+    transform: translateY(0);
+  }
+  75% {
+    transform: translateY(-100px);
+  }
+  90% {
+    transform: translateY(0);
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+  }
+}
 </style>

src/components/ActivitiesList/ActivitiesList.vue

@@ -74,6 +74,7 @@ const { config } = storeToRefs(store)
       width: 48px;
       height: 61px;
       background: center / cover no-repeat url(@/assets/images/scrollHand.png);
+      animation: slideNhide 3s ease-in-out forwards;
     }
     .bscroll-indicator {
       height: 95px !important;

src/components/BrandScroll/BrandScroll.vue

@@ -102,12 +102,12 @@ watch([scroll, () => props.shop], () => {
       position: absolute;
       content: '';
       left: 0;
-
       top: 120px;
       margin: auto;
       width: 48px;
       height: 61px;
       background: center / cover no-repeat url(@/assets/images/scrollHand.png);
+      animation: slideNhide 3s ease-in-out forwards;
     }
     .bscroll-indicator {
       height: 95px !important;

src/components/SearchResultList/SearchResultList.vue

@@ -124,6 +124,7 @@ function handleShop(item) {
       width: 48px;
       height: 61px;
       background: center / cover no-repeat url(@/assets/images/scrollHand.png);
+      animation: slideNhide 3s ease-in-out forwards;
     }
     .bscroll-indicator {
       height: 95px !important;