From c5dbcdf3fcb2df52241c73e899ce704ec307c62e Mon Sep 17 00:00:00 2001
From: raofuzi <2641346316@qq.com>
Date: Sat, 20 Apr 2024 13:04:52 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BF=AE=E6=94=B9=E5=8A=A0=E8=BD=BD?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/home/content/Content.vue | 41 ++++++++++++++++++------------
 1 file changed, 25 insertions(+), 16 deletions(-)

diff --git a/src/views/home/content/Content.vue b/src/views/home/content/Content.vue
index 0823f59..aca7e5f 100644
--- a/src/views/home/content/Content.vue
+++ b/src/views/home/content/Content.vue
@@ -144,7 +144,7 @@ onUpdated(() => {
   nextTick(() => {
     setTimeout(() => {
       layout()
-    }, 1500)
+    }, 2000)
   })
 })
 
@@ -304,7 +304,7 @@ const gridMinHeight = computed(() => {
   let height = ''
   if (viewMode.value === 'masonry' && loading.value)
     height = '145px'
-  else 
+  else
     height = ''
 
   return height
@@ -741,15 +741,17 @@ defineExpose({
                 :fallback-src="bgLoadingImg"
                 style="display: none"
               />
-              <img @click="
-                      ($event) => {
-                        previewHandler(index, $event);
-                        hideDownload($event);
-                      }
-                    " v-lazy="item.thumburl" class="img" :class="{
+              <img
+                v-lazy="item.thumburl" class="img" :class="{
                   'img-fit': viewMode === 'horizontalVersion',
                   'img-full': viewMode === '3:4' || viewMode === 'verticalVersion',
-                }" alt="">
+                }" alt="" @click="
+                  ($event) => {
+                    previewHandler(index, $event);
+                    hideDownload($event);
+                  }
+                "
+              >
               <img
                 v-if="item.states == 3"
                 class="tag-status"
@@ -1076,23 +1078,30 @@ defineExpose({
         width: 6px;
         height: 6px;
         background: #f1f1f1;
-        display: none;
-      }
-      &:hover {
-        &::-webkit-scrollbar {
-          display: block;
-        }
+        visibility: hidden;
       }
       /* 定义滚动条轨道的样式 */
       &::-webkit-scrollbar-track {
         background-color: #e1e1e1;
         border-radius: 10px; /* 圆角 */
+        visibility: hidden;
+      }
+      &:hover {
+        &::-webkit-scrollbar {
+          visibility: visible;
+        }
+        &::-webkit-scrollbar-track {
+          visibility: visible;
+        }
+        &::-webkit-scrollbar-thumb {
+          visibility: visible;
+        }
       }
-
       /* 定义滚动条滑块的样式 */
       &::-webkit-scrollbar-thumb {
         background-color: #888;
         border-radius: 10px; /* 圆角 */
+        visibility: hidden;
       }
 
       /* 滑块hover时的样式 */