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

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

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

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

针对于iosAPP内嵌H5，-webit-overflow-scrolling:touch;产生空白情况的更多相关文章

  1. 微信小程序中使用 <web-view> 内嵌 H5 时，登录问题的处理方法

    在微信小程序的开发中,经常遇到需要使用 <web-view></web-view> 内嵌 H5 的需求.在这种需求中比较棘手的问题应该就是登录状态的判断了,小程序中的登录状态怎 ...

  2. 安卓内嵌H5只展示部分静态页面

    问题: 安卓内嵌H5在华为P9部分机型只展示h5静态页面无法展示接口返回渲染的页面 解决办法: Android  关闭硬件加速   android:hardwareAccelerated=" ...

  3. ios应用内嵌h5页面数据自动变色识别为手机号码的解决方法——手机号码拨号禁用IOS手机页面数字自动识别为手机号

    异常如下: ios应用内嵌h5页面,本来是设置了白色的数字,两三秒之后会自动变为黑色,然后点击的时候就会弹出是否拨号的提示: 解决方法: 添加如下meta标签,即可解决: <meta name= ...

  4. APP中内嵌H5页面为什么不能下载？

    在APP中内嵌H5页面,若页面上存在下载链接,没有任何反应,为什么呢? 原因是app中内嵌的H5页面是WebView解析的,什么是WebView呢? 在Android手机中内置了一款高性能webkit ...

  5. 小程序内嵌H5——判断小程序环境的坑

    现在各种小程序风靡,这边H5的需求还没有搞定,产品又要求做小程序版本,做可以,关键是618前上线,我-- whatever,618要做推广,日期订了,剩下的就只能是排期,定方案,尽可能完成. 最后和产 ...

  6. android内嵌H5页（webview）如何定位

    一.切换至webview后再定位元素 (1)获取页面上下文 contexts = driver.contexts (2)切换至webview driver.switch_to.context(cont ...

  7. appium常见问题02_android内嵌H5页（webview）如何定位

    现在大多数app都是由原生页面和内嵌H5(即webview)组成,app原生页面直接定位即可,那内嵌H5页面要如何定位呢. 相信大多数人用appium做自动化时都有遇到这个问题,小编总结了下工作中该问 ...

  8. 小程序中webview内嵌h5页面

    小程序内嵌h5页面跳转小程序指定页面,  需要引用  JSSDK:   <script src="https://res.wx.qq.com/open/js/jweixin-1.3.2 ...

  9. 小程序通过 url 向内嵌 H5 传参注意事项

    当在小程序中通过 url 向 <web-view> 内嵌的 H5 传参时,当包含特殊字符时需要进行编码处理(不然 <web-view> 中是拿不到值的,小程序竟然没有错误提示. ...

随机推荐

  1. 2020.10.6 ThreadLocal

    在多线程环境下,每个线程都有自己的数据.一个线程使用自己的局部变量比使用全局变量要好,因为局部变量不会被其他线程改变. 但是局部变量也存在问题--在函数调用的时候,传递起来很麻烦: def proce ...

  2. dependencies与devDependencies中应该放哪些依赖

    网上一般的解释都是,开发环境用devDependencies,生产环境用dependencies,说的很简明,但是这里有个问题是,哪些包需要放到devDependencies中,哪些包需要放到depe ...

  3. LeetCode-054-螺旋矩阵

    螺旋矩阵 题目描述:给你一个 m 行 n 列的矩阵 matrix ,请按照 顺时针螺旋顺序 ,返回矩阵中的所有元素. 示例说明请见LeetCode官网. 来源:力扣(LeetCode) 链接:http ...

  4. Hystrix&Dashboard配置使用

    目录 Hystrix是什么 熔断 什么是熔断 熔断类型 打开 半开 关闭 使用方法 导包 添加启动注解 新增方法 测试 降级 什么是降级 使用方法 导包 修改yml,新增如下 启动类新增注解 @Ena ...

  5. Java运算符 算术运算法

    运算符 算术运算法:+,-,*,/,%,++,– 复制运算符:= 关系运算符:>,<,>=,<=,==,!= instanceof 逻辑运算符:&&,||,! ...

  6. Windows XP系统搜索故障及处理办法点点通

    故障1:单击资源管理器工具栏上的"搜索"按钮或者按F3,系统无任何响应. 解决方法:首先进入C:\Windows\inf文件夹(该文件夹属性为隐藏),右键单击srchasst.in ...

  7. new和@Autowired的区别

    controller层: @RequestMapping("/payment") @RestController public class WxPayController { pu ...

  8. linux 查看命令

    linux查找命令 ls查看文件信息 ​ 就是list的缩写,通过ls 命令不仅可以查看linux文件夹包含的文件,而且可以查看文件权限(包括目录.文件夹.文件权限)查看目录信息等等 ​ 常用参数搭 ...

  9. YCCMS 3.3 CSRF漏洞--代码执行

    一. 启动环境 1.双击运行桌面phpstudy.exe软件 2.点击启动按钮,启动服务器环境 二.代码审计 1．双击启动桌面Seay源代码审计系统软件 2.点击新建项目按钮,弹出对画框中选择(C:\ ...

  10. toppo-1

    靶机准备 由于是.vmdk文件,新建一个虚拟机把硬盘移除,在将此vmdk文件添加为新硬盘即. 开机发现给出了ip地址:192.168.164.184,且当前网络模式为NAT 将kali也设置为NAT模 ...