Commit 2c33a8d06c6abb0628881f47b796a8d56bfe6ba1
1 parent
947741a4
列表滑动内容高度计算
Showing
2 changed files
with
16 additions
and
2 deletions
src/pages/myGiftBox/myGiftBox.less
| ... | ... | @@ -3,11 +3,21 @@ |
| 3 | 3 | // height: calc(100vh-25px); |
| 4 | 4 | background-color: #fff; |
| 5 | 5 | padding-top: 25px; |
| 6 | + .gift_top{ | |
| 7 | + width: 100%; | |
| 8 | + background-color: #fff; | |
| 9 | + position: fixed; | |
| 10 | + left: 0; | |
| 11 | + top: 0; | |
| 12 | + z-index: 100; | |
| 13 | + } | |
| 6 | 14 | .top_box { |
| 15 | + z-index: 10; | |
| 7 | 16 | display: flex; |
| 8 | 17 | justify-content: space-between; |
| 9 | 18 | height: 45px; |
| 10 | 19 | margin: 0 30px; |
| 20 | + // padding-top: 30px; | |
| 11 | 21 | img { |
| 12 | 22 | width: 37px; |
| 13 | 23 | height: 37px; |
| ... | ... | @@ -48,10 +58,11 @@ |
| 48 | 58 | } |
| 49 | 59 | } |
| 50 | 60 | .item_box{ |
| 51 | - height: calc(100vh-214px); | |
| 61 | + // height: calc(100vh-224px); | |
| 52 | 62 | padding-bottom: 40px; |
| 53 | 63 | overflow-y: auto; |
| 54 | 64 | box-sizing: border-box; |
| 65 | + padding-top: 120px; | |
| 55 | 66 | .giftItem_box:first-child{ |
| 56 | 67 | margin-top: 20px; |
| 57 | 68 | } | ... | ... |
src/pages/myGiftBox/myGiftBox.vue
| 1 | 1 | <template> |
| 2 | 2 | <div class="my_gift_box"> |
| 3 | + <!-- 头部 --> | |
| 4 | + <div class="gift_top"> | |
| 3 | 5 | <!--tab切换--> |
| 4 | 6 | <div |
| 5 | 7 | class="top_box" |
| 6 | - :style="'padding-top: ' + $parent.top.value + 'px'" | |
| 8 | + :style="'padding-top: ' + ($parent.top.value+15) + 'px'" | |
| 7 | 9 | > |
| 8 | 10 | <img @click="$parent.back" src="static/img/icon_back.png" /> |
| 9 | 11 | <div class="tabs"> |
| ... | ... | @@ -27,6 +29,7 @@ |
| 27 | 29 | </van-tab> |
| 28 | 30 | </van-tabs> |
| 29 | 31 | </div> |
| 32 | + </div> | |
| 30 | 33 | <!--下拉刷新--> |
| 31 | 34 | <!-- <van-pull-refresh v-model="isLoading" @refresh="onRefresh"> --> |
| 32 | 35 | <!--内容--> | ... | ... |