ExtJS网页显示在Chrome切换设备模式和手机浏览器中有所不同

问题描述：

嗨我试图构建一个可以通过移动浏览器使用的Web应用程序。ExtJS网页显示在Chrome切换设备模式和手机浏览器中有所不同

首先，我开发网页并通过Chrome模拟移动模式。

然而，我使用连接到该站点的移动，显示不一样的浏览器。

我也没办法来解决这个问题。任何人都可以给我建议或关键词的谷歌？

谢谢

您使用煎茶触摸？ – aviram83

没有。我的版本是extjs 5.0.1 –

你在哪个移动设备上测试它？你尝试过Android和iOS，结果是一样的吗？ – aviram83

答

我找到了解决方案。

在ext-all.js中，有一个函数initMeta来设置元。

initMeta: function() { 
       var me = this, 
        maxScale = me.maxUserScale || 1; 

       me.addMeta('viewport', 'width=device-width, initial-scale=1, maximum-scale=' + 
         maxScale + ', user-scalable=' + (maxScale !== 1 ? 'yes' : 'no')); 
       me.addMeta('apple-mobile-web-app-capable', 'yes'); 
      },

我们可以通过修改initial-scale值使其小于1

希望这一招将帮助别人。

UPDATE

我认为这是一个更好的办法来避免修改EXT-all.js。

当app.js执行发射功能我添加这些代码：

launch: function() { 
    if (Ext.supports.Touch) { 
     var head = Ext.getHead(), 
      viewportMeta = head.dom.getElementsByTagName('meta')[0]; 

     viewportMeta.setAttribute('content', 'width=device-width, initial-scale=0.5, maximum-scale=1, user-scalable=yes'); 
    } 
}

ExtJS网页显示在Chrome切换设备模式和手机浏览器中有所不同

相关推荐