Browse Source

解决首页楼层侧边栏显示随分辨率改变变化的bug

yangc 8 years ago
parent
commit
c856d5a124
1 changed files with 3 additions and 14 deletions
  1. 3 14
      components/home/floor/FloorBar.vue

+ 3 - 14
components/home/floor/FloorBar.vue

@@ -1,5 +1,5 @@
 <template>
-  <ul class="floor-bar list-unstyled" :class="{hide: !visible}">
+  <ul class="floor-bar list-unstyled" :style="!visible?'opacity: 0;':'opacity: 1;'">
     <li v-for="(floor, index) in floors.data" :key="index" class="floor-bar-item">
       <a @click="jumpFloor(index)"
          :style="{backgroundColor: index==activeFloor?floor.items[1].backGroundColor:'#b7dfff'}">
@@ -31,9 +31,8 @@
         let scrolled = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop
         let floors = document.querySelectorAll('.floor')
         let barOffset = document.querySelector('.floor-bar').offsetTop
-       // console.log(floors[floors.length - 1].offsetTop)
         if (floors[0].offsetTop === 0) {
-          this.visible = scrolled >= floors[0].offsetTop + this.floor_scrollTop - 285 && scrolled <= floors[floors.length - 1].offsetTop + this.floor_scrollTop
+          this.visible = scrolled >= floors[0].offsetTop + this.floor_scrollTop - barOffset && scrolled <= floors[floors.length - 1].offsetTop + floors[floors.length - 1].offsetHeight - barOffset - document.querySelector('.floor-bar').offsetHeight + this.floor_scrollTop
           if (this.visible) {
             for (let i = 0; i < floors.length; i++) {
               if (barOffset >= floors[i].offsetTop + this.floor_scrollTop - scrolled + 60) {
@@ -42,7 +41,7 @@
             }
           }
         } else {
-          this.visible = scrolled >= floors[0].offsetTop - 285 && scrolled <= floors[floors.length - 1].offsetTop
+          this.visible = scrolled >= floors[0].offsetTop - barOffset + 40 && scrolled <= floors[floors.length - 1].offsetTop + floors[floors.length - 1].offsetHeight - barOffset - document.querySelector('.floor-bar').offsetHeight
           if (this.visible) {
             for (let i = 0; i < floors.length; i++) {
               if (barOffset >= floors[i].offsetTop - scrolled + 60) {
@@ -51,16 +50,6 @@
             }
           }
         }
-    /*    let barOffset2 = 0
-        this.visible = (barOffset >= floors[0].offsetTop - scrolled &&
-          barOffset2 <= floors[floors.length - 1].offsetTop - scrolled + floors[floors.length - 1].clientHeight)
-        if (this.visible) {
-          for (let i = 0; i < floors.length; i++) {
-            if (barOffset >= floors[i].offsetTop - scrolled + 60) {
-              this.activeFloor = i
-            }
-          }
-        } */
       },
       jumpFloor (index) {
         if (this.visible) {