使用Foundation的单页移动应用程序视窗

Single page app viewport mobile using Foundation

本文关键字:应用程序 移动 单页 Foundation 使用      更新时间:2023-09-26

我正在使用一个响应式网站的基础,并且只有当您通过我们的ng-include加载另一个页面时,一些移动设备才无法正确缩放视口。这会将新内容加载到页面中,然后页面宽度中断并需要水平滚动。

这种情况不会发生在某些设备上,比如Galaxy Note 3/4,但会发生在具有相同分辨率的设备上,比如iPhone 6 Plus。我确实有一个viewport属性和缩放集:

<meta name="viewport" content="width=device-width, initial-scale=1, target-densityDpi=device-dpi;">

当我为这个单页应用程序加载新的动态内容时,任何帮助弄清楚为什么不能正确缩放的原因都是非常感谢的。我不确定它是否相关(只是想到它),但我们也经常使用文档均衡器回流:

$(document).foundation('equalizer','reflow');

我需要添加最小和最大比例。虽然我没有测试它,但我想我只需要添加一个最大比例,因为内容从屏幕上流出。

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">