[英]Why is the font of my Cordova App so extremely small on Windows Phone 8.1 Device?
I created a Web app and now converted this to a Cordova App. 我创建了一个Web应用程序,现在将其转换为Cordova应用程序。 When I deploy it to my Windows Phone 8.1 device, the text is extremely small, much smaller than in the browser on the same device. 当我将其部署到Windows Phone 8.1设备时,文本非常小,比同一设备上的浏览器小得多。 I now created a mini app which just shows one line of text, same here, text is small in the Cordova App, text has normal size if I run it in the Browser on the same phone. 我现在创建了一个迷你应用程序,它仅显示一行文本,此处相同,Cordova应用程序中的文本很小,如果我在同一部手机的浏览器中运行,则文本大小正常。
I tried creating it as Windows Phone 8 App, then the text has the right size. 我尝试将其创建为Windows Phone 8 App,然后文本具有正确的大小。
I played around with the viewport meta tag, didn't change anything. 我玩过视口meta标签,没有做任何更改。
You may be running into a problem where certain web frameworks go into "iPad Mode" with devices that have a 768px effective width. 您可能会遇到这样的问题:某些Web框架的有效宽度为768px的设备进入“ iPad模式”。 This was a common problem with Twitter bootstrap. 这是Twitter引导程序的常见问题。
There are some fixes suggested such as this one though you'd need to detect IE 11 instead of 10: https://timkadlec.com/2013/01/windows-phone-8-and-device-width/ 尽管您需要检测IE 11而不是10,但建议使用一些修复程序,例如: https : //timkadlec.com/2013/01/windows-phone-8-and-device-width/
There was a bug in Windows Phone implementation, which didn't calculate the viewport's size in the correct way. Windows Phone实施中存在一个错误,该错误无法以正确的方式计算视口的大小。 This was fixed in Windows Phone Update 3 (8.0.10512), but unfortunately not for Nokia Lumia 920. Therefore, the recommended workaround is to add the following script: 此问题已在Windows Phone Update 3(8.0.10512)中修复,但不幸的是不适用于Nokia Lumia920。因此,建议的解决方法是添加以下脚本:
if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
var msViewportStyle = document.createElement("style");
msViewportStyle.appendChild(
document.createTextNode("@-ms-viewport{width:auto!important}")
);
document.getElementsByTagName("head")[0].
appendChild(msViewportStyle);
}
If you are building a Cordova app, it should be sufficient to add the style to the style sheet of Windows Phone: 如果要构建Cordova应用程序,则将样式添加到Windows Phone样式表中就足够了:
@-ms-viewport {
width: auto !important;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.