行程绝对定位导航

src/pages/detailsNew.vue

 <template>
-  <div style="min-height: 80vh;overflow: hidden;">
-    <div v-if="dataList && !$q.loading.isActive">
+  <div class="" style="min-height: 80vh;overflow: hidden;">
+    <div v-if="dataList && !$q.loading.isActive"
+    class="relative"
+    style="max-width: 1200px;margin: auto;">
       <div
         style="
           position: fixed;
@@ -406,20 +408,13 @@
       <div
         v-if="dataList"
         style="width: 1200px; margin-left: auto; margin-right: auto"
-        class="q-mt-xl row relative"
+        class="q-mt-xl row"
         :class="{ 'q-px-md': $q.screen.width < 1220 && $q.screen.width > 760 }"
       >
         <!-- col q-ml-xl position-relative -->
-        <!-- dataList.priceList.length > 0 &&
-            !(dataList.priceList && dataList.priceList[0].teamType == 2) &&
-            !(dataList.currentPrice && dataList.currentPrice.teamType == 2) &&
-            currentHeight > days[0].top - 60 &&
-            currentHeight < navs[2].top &&
-            $q.platform.is.desktop -->
         <div
-          :class="{'fixed':$q.platform.is.desktop}"
-          :style="{'top':currentHeight>navs[1].top?'200px':'200px',
-          'left':currentHeight>navs[1].top?'180px':'180px',}"
+          class="absolute"  style="z-index: 999;left: -150px;"
+          :style="{'top':currentHeight>navs[1].top?(currentHeight+100)+'px':(currentHeight+200)+'px'}"
           v-if="
             dataList.priceList.length > 0&&$q.platform.is.desktop&&currentHeight>navs[1].top-400
             &&currentHeight<navs[2].top
@@ -459,7 +454,7 @@
           >
             行程特色
           </div>
-          <div class="relative">
+          <div>
 
           <div class="q-pb-xl" v-if="tripImages&&tripImages.length>0"
             ref="diyContext">
@@ -651,15 +646,12 @@
           </div> -->
         </div>
         <template v-if="$q.platform.is.desktop&&currentHeight>130
-          &&$refs.journeyLookOut.getBoundingClientRect().top+currentHeight-300>currentHeight">
+          &&$refs.journeyLookOut.getBoundingClientRect().top+currentHeight-280>currentHeight">
           <!-- <div class="col-1"></div> -->
           <!-- col q-ml-xl position-relative -->
-
           <div
-          :class="{'absolute':currentHeight<1000,
-          'fixed':currentHeight>1000}"
-          :style="{'top':currentHeight<1000?'0':'100px',
-          'right':currentHeight<1000?'-150px':'170px',}">
+          class="absolute" style="z-index: 999;right: -150px;"
+          :style="{'top':currentHeight<1000?'1000px':(currentHeight+100)+'px'}">
             <!--  style="position: sticky; top: 100px" -->
             <div>
               <div