feat: 滚动折叠适配web端

pages/template/scroll-fold-nav/scroll-fold-nav.uvue

 <template>
-  <scroll-view @scroll="onScroll" class="scroll-view" rebound="false">
+  <scroll-view @scroll="onScroll" class="scroll-view" rebound="false">
+    <!--#ifdef APP-->
     <view class="height-seat" style="height: 125px;">
       <!-- 垫高专用 -->
-    </view>
+    </view>
+    <!--#endif-->
+    <!--#ifdef WEB-->
+    <view class="height-seat" style="height: 90px;">
+      <!-- 垫高专用 -->
+    </view>
+    <!--#endif-->
+
     <view class="content">
       <view class="content-item">
         <text class="text">1. 当前示例监听了 scroll-view 的 scroll 事件 ，滚动页面实时监听scrollTop。</text>
@@ -55,8 +63,13 @@
     },
     methods: {
       onScroll(e : ScrollEvent) {
-        let scrollTop = e.detail.scrollTop
-        this.boxNode?.style?.setProperty('height', (125 - (scrollTop > this.statusBarHeight ? this.statusBarHeight : scrollTop)) + 'px');
+        let scrollTop = e.detail.scrollTop
+        // #ifdef APP
+        const originalBoxHeight = 125
+        // #else
+        const originalBoxHeight = 90
+        // #endif
+        this.boxNode?.style?.setProperty('height', (originalBoxHeight - (scrollTop > 35 ? 35 : scrollTop)) + 'px');
         this.boxNode?.style?.setProperty('background-color', 'rgba(255, 255, 255, ' + (scrollTop * 3 > 100 ? 100 : scrollTop * 3) / 100.0 + ')');
         this.navNode?.style?.setProperty('opacity', 1 - (scrollTop * 3 > 100 ? 100 : scrollTop * 3) / 100.0);
         this.searchNode?.style?.setProperty('width', 700 - (scrollTop > 40 ? 40 : scrollTop) + 'rpx');
@@ -130,10 +143,14 @@
   .top-box {
     position: fixed;
     top: 0;
-    padding-top: 35px;
     align-items: flex-end;
-    border-bottom: 1px solid #efefef;
+    border-bottom: 1px solid #efefef;
+    /* #ifdef APP */
     height: 125px;
+    padding-top: 35px;
+    /* #else */
+    height: 90px;
+    /* #endif */
     background-color: rgba(255, 255, 255, 0);
     background-color: aliceblue;
   }
@@ -149,8 +166,12 @@
   }
 
   .nav-back {
-    position: absolute;
-    top: 46px;
+    position: absolute;
+    /* #ifdef APP */
+    top: 46px;
+    /* #else */
+    top: 11px;
+    /* #endif */
     left: 8px;
   }