收藏
评论

【IOS底部前进后退白条】可能触发自动隐藏的条件


这里是用vue开发的单页应用,实际上我是需要这条白条的,所以这里不讨论通过清除历史记录来控制不显示这个白条。

搜了一天发现大家都说使页面滚动就会自动隐藏,我一直以为是我自己的布局影响了。

当然我只是个新手,所以排查了很久才发现:


当页面内容高度低于 2000px(vue) 的时候,滚动页面,是不会隐藏这个白条的,

当页面内容高度高于2001px(vue) 的时候,滚动页面就会自动隐藏这个白条了。


PS:以上的高度指的是我在vue里面设置的高度

用一个普通的html页面测试时:

iPhone 8 的临界值是:2615px

iPhone 7P 的临界值是 :2614px

(emmm 大概是跟屏幕分辨率有点关系吧、 么有别的手机可以测试了呀、)


不是非常确定微信是否是根据我们页面内容的高度来判断,但是目前我所做的尝试只得出了这个结论(错了请不要吐槽我,仅供参考),还是希望官方能告诉我们具体出现的规则。

以上。

收藏

2 个评论

  • 发呆的祥
    发呆的祥
    2019-05-22

    我这个更气人:图1 是一个活动页,可以看到有前进后退的白条导航栏, 图2是向上滑动后白条隐藏,然后从这个页面跳到一个短一点的页面图3,白条遮住了底部控件tab栏,但是又不算视窗高度,然后滚动又隐藏不了。。。iw是获取的window.innerHeight,ow是获取的window.outerHeight;肺都气炸了。


    2019-05-22
    赞同 1
    回复 2
    • A吴澍
      A吴澍
      2020-01-17
      有解决吗
      2020-01-17
      回复
    • 喵喵侠
      喵喵侠
      2022-04-21
      主要是白条有两种,一种是占据一部分高度,另一种是盖在页面上面。
      2022-04-21
      回复
  • 王俊钧
    王俊钧
    2021-09-15

    快 2022年了还没解决

    2021-09-15
    赞同
    回复
登录 后发表内容