收藏
回答

怎么让吸顶后滚动的内容和吸顶内容不重叠?

我做的吸顶,滚动之后滚动的内容和吸顶内容重叠了,怎么控制?如图:


<view class="head_view static_head" style='z-index: 1;{{fixTop<scrollTop ? "position: sticky; position: -webkit-sticky; position: -moz-sticky; position: -ms-sticky; position: -o-sticky; top: 0;": ""}}'>

</view>

onShow: function () {

let self = this;

wx.createSelectorQuery().select('.static_head').boundingClientRect(function (rect) {

self.setData({

fixTop: rect.top,

})

}).exec()


},


onPageScroll: function (res) {

let self = this;

let top = res.scrollTop;

self.setData({

scrollTop: top

});

}


回答关注问题邀请回答
收藏

5 个回答

  • 杭州弧途科技有限公司
    杭州弧途科技有限公司
    2019-08-22

    position: sticky 貌似是有兼容性问题的吧? 你试试 IOS上可以用么?

    2019-08-22
    赞同
    回复
  • Tiger~
    Tiger~
    2019-08-22

    1.吸顶容器设置背景色。

    2.z-index设置大一些。

    3.另外 吸顶可以试试position:sticky。具体使用方法可以搜索一下。

    2019-08-22
    赞同
    回复 2
    • null
      null
      2019-08-22
      谢谢,设置背景色可以
      2019-08-22
      回复
    • StephenO_o
      StephenO_o
      2019-10-10
      postion: sticky小程序开始支持了???
      2019-10-10
      回复
  • 仙森ღ₅₂₀¹³¹⁴
    仙森ღ₅₂₀¹³¹⁴
    2019-08-22

    吸顶的内容设置下背景颜色 即可 还有类似问题建议写个代码片段

    2019-08-22
    赞同
    回复 1
    • null
      null
      2019-08-22
      谢谢,设置背景色确实有用,不过看着很突兀,我再想想办法
      2019-08-22
      回复
  • 阿客
    阿客
    2019-08-22

    z-index

    2019-08-22
    赞同
    回复 2
    • null
      null
      2019-08-22
      没用啊
      2019-08-22
      回复
    • 阿客
      阿客
      2019-08-22回复null
      有用的。
      2019-08-22
      回复
  • 俞小海
    俞小海
    2019-08-22
    哦?
    2019-08-22
    赞同
    回复 1
    • 俞小海
      俞小海
      2019-08-22
      2019-08-22
      回复
登录 后发表内容
问题标签