-1 
<!doctype html>
<html>
<head>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=600,user-scalable=no">
</head>
<body>
<div style="width:570px;height:300px;border:1px solid black" >
<input type=text>
</div>
</body>
</html>

从主屏幕打开上面的文件并在横向模式下点击输入框，然后将手机旋转到纵向模式，屏幕放大并且无法缩小。在 Safari 中打开时不会发生。

重现步骤：
1.将书签保存到主屏幕
2.从主屏幕打开书签
3.将手机切换到横向模式
4. 点击输入框，出现键盘
5.将手机调至人像模式

预期结果：屏幕不应放大。

实际结果：屏幕放大。

版本：IOS 9

注意：在 IOS9 之前没有发生。不会在 Safari 中发生，只会在 Web Clip 中发生。

任何解决方法的想法？

4

1 回答 1

0

在这里找到了解决方案：

https://github.com/scottjehl/iOS-Orientationchange-Fix

虽然对我来说不需要加速度计，但只需将元内容设置为“maximum-scale=1”就可以了：

 var meta = document.querySelector( "meta[name=viewport]" ),
            initialContent = meta && meta.getAttribute( "content" ),
            disabledZoom = initialContent + ",maximum-scale=1";

        function restoreZoom(){
            meta.setAttribute( "content", disabledZoom );
            
        }
window.addEventListener( "orientationchange", restoreZoom, false );

于 2016-05-03T18:16:01.870 回答