no message

pages/index.html/index.vue

@@ -19,7 +19,7 @@
     </div>
     <div class="in-end" v-if="page == 0 && list.length > 0">- 到底了 -</div>
 
-    <div class="returnTop right-fixed" style="bottom: 18px;">
+    <div class="right-returnTop" v-if="returnTopState" @click="returnTop()">
         <img src="@/assets/img/returnTop-icon.png" style="width: 24px; height: 24px;" />
     </div>
 </template>
@@ -66,6 +66,9 @@ onMounted(async () => {
 const handleScroll = () => {
     const scrollTop = document.documentElement.scrollTop || document.body.scrollTop
 
+    if (scrollTop > 200) returnTopState.value = true
+    else returnTopState.value = false
+
     const scrollHeight = document.documentElement.scrollHeight
     const clientHeight = document.documentElement.clientHeight
 
@@ -160,6 +163,15 @@ try {
         })
     }
 } catch (error) {}
+
+let returnTopState = ref(false)
+
+const returnTop = () => {
+    window.scrollTo({
+        top: 0,
+        behavior: "smooth",
+    })
+}
 </script>
 
 <style scoped lang="less">
@@ -215,10 +227,7 @@ try {
     margin-bottom: 88px;
 }
 
-.returnTop {
-}
-
-.right-fixed {
+.right-returnTop {
     position: fixed;
     right: calc((100vw - 1200px) / 2 - 75px);
     width: 50px;
@@ -232,4 +241,10 @@ try {
     z-index: 10;
     cursor: pointer;
 }
+
+@media screen and (max-width: 1360px) {
+    .right-returnTop {
+        right: 0 !important;
+    }
+}
 </style>