zoukankan      html  css  js  c++  java
  • 针对于iosAPP内嵌H5,-webit-overflow-scrolling:touch;产生空白情况

    问题描述:一个内嵌IOSAPP的H5页面,长页面,大概1.6个屏幕高度,由于有列表滑动起来很不流畅,所以用了-webit-overflow-scrolling:touch;这个只针对ios端的物理滚动属性来调整,但是滚动流畅实现了,部分区域因为加了这个属性出现滑动白屏情况。原有的html结构也还在就是不显示。

    调试过程:最开始把问题定位在空白区域样式问题,包括把overflow全部重置,JS强行展示都没有效果。最后发现引起滚动的长页面有一个盒子没有定义高度,这个高度是由里面的内容撑开的,所以尝试给这个列表盒子定了一个高度,果然在滑动的过程中不再出现空白区域,最后为了适配使用弹性布局,让列表盒子撑满剩下的屏幕,并且内部盒子定义高度。

    结论:使用-webit-overflow-scrolling:touch;这种滑动过程中出现白屏的情况,暂时测试出现在小范围滚动的长页面,如果是特别长的数据列表测试是没有出现这个问题。

    tip:这个属性比较消耗性能,如果对于性能有要求的页面,不是特别长的页面可以用其他方法实现

  • 相关阅读:
    python深浅拷贝
    软件开发目录规范
    编码规范
    python进程、线程、协程的介绍及使用
    soket粘包问题及解决方案
    python socket通信
    数据开发_机器学习
    数据开发_开发工具以及工具链
    数据开发_Python读取文件
    数据开发_Java设计模式_IO以及读取资源文件
  • 原文地址:https://www.cnblogs.com/10manongit/p/12996924.html
Copyright © 2011-2022 走看看