本文共 1034 字,大约阅读时间需要 3 分钟。
前天,客户打电话来说系统出现了一个问题,就是苹果的手机页面不能往下滑动,导致数据显示只有一页,很多数据都不能显示。情况如下: 但是在安卓手机上很正常,经过分析,和js和ajax都没有关系,那么就只可能是和mui框架或者iframe标签有关系了,找到原因后就可以定位解决了。 具体的原因是因为mui的框架样式不兼容苹果手机的浏览器,css样式有两个属性可以完美的帮助我们解决这个问题。我们将它修改一下,自己写一个样式添加上去就可以。
原先的代码:
做如下修改,来兼容iphone的浏览器。
1、添加css样式:
/*********************************************************************//* 修改人:张连康 修改内容:兼容iframe框架的苹果手机端的下滑滚动 修改时间:2018年8月29日17:01:35*/ .main-iframe-holder { margin-top:44px; /*适应手机端顶部区域*/ position: fixed; right: 0; bottom: 0; left: 0; top: 0; -webkit-overflow-scrolling: touch; overflow-y: scroll;} .main-iframe-holder iframe { height: 100%; width: 100%; }/*********************************************************************/
2、将原先的mui的框架div去掉,换成如下div,并应用上面的css样式。
3、查看效果,经过测试在苹果手机上都已经解决了。
也是经过查看了好多资料才找到的解决方案,这是一个国外的网站,幸好没有被墙掉,不然都不知道要费多少时间才能解决,就这样,也是花费了一天的时间和精力,软考和自考都落下很多了。。。希望系统不要在有bug了,让我安静的学习一段时间。 解决问题前,一定要分析问题产生的原因,不能上来就干,要不然会浪费很多时间,做一些无用功。才好对症下药,提高效率、节省时间。