项目上有需求,需要使用Sencha Touch加载远程Html,首先想到使用iframe处理,在浏览器上测试,展示效果还不错。以为万事大吉了,但是后来在ipad上测试发现iframe嵌入的网页没法上下滚动,于是继续研究,发现需要在iframe外层加入一个height和width都固定的div,然后增加style
-webkit-overflow-scrolling:touch; overflow: scroll;
代码如下:
{ layout : 'fit', xtype : 'panel', html : '<div style="width:774px;height:450px;-webkit-overflow-scrolling:touch; overflow: scroll;"><iframe id="object" height="100%" width="100%" type="text/html" src="http://www.baidu.com/"></iframe></div>' },