我有一个非常简单的HTML页面,其中包含适用于iPhone的META标记:
<meta name="viewport" content="height=device-height,width=device-width,initial-scale=1.0,user-scalable=no" />
Run Code Online (Sandbox Code Playgroud)
使用iPhone Safari,当页面以纵向模式加载时,它看起来很好,宽度适合屏幕.当我将iPhone旋转到横向模式时,网页会自动调整大小以适应横向宽度.好,这就是我想要的.
但是当我从横向旋转回来时,页面不会像以前一样调整回适合纵向宽度.它仍然在景观宽度.
我希望iPhone能够自动将其设置回正确的宽度,就像横向模式一样.我不认为这应该涉及方向监听器,因为它全部是自动完成的,我没有任何特殊的样式用于不同的模式.
为什么iPhone不以纵向模式重新调整网页大小?我该如何解决?
我设法让iPhone自动调整大小,但有一个奇怪的现象,只有在偶数次旋转之后这样做...非常非常奇怪.
我使用这个META标签:
<meta name="viewport" content="height=device-height, width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
Run Code Online (Sandbox Code Playgroud)
以下是我必须做的事情才能使其自动调整大小:
1.纵向加载 - >看起来不错.
2.旋转到横向 - >调整大小以适合屏幕.
3.向后旋转至纵向 - >不调整大小.
4.旋转到横向 - >仍然适合景观.
5.旋转至纵向 - >调整大小以适合纵向屏幕.
有人可以解释这种行为吗?
我仍然想知道如何解决这个问题,并感谢任何帮助.
谢谢!
汤姆.
我使用HTML5的localStorage编写了一个简单的iPhone Web应用程序.
在2G设备上进行的测试表明,虽然打开的Safari窗口被记住,但是在Safari进程被杀死后,使用localStorage存储的数据不会持久存在.
如果我在不同的Safari窗口上的不同站点上,则数据也会丢失,然后我将窗口更改为显示主题中的Web应用程序的位置.当Safari加载页面时,它会自动刷新页面.然后数据丢失.这是一个简单的测试代码:
<html>
<head>
<meta name="viewport" content="height=device-height, width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
</head>
<body>
<script>
alert("1:" + localStorage.getItem("test"));
localStorage.setItem("test", "123");
alert("2:" + localStorage.getItem("test"));
</script>
</body>
Run Code Online (Sandbox Code Playgroud)
据我所知,数据应该坚持下去!
任何人都可以对这种行为有所了解吗?我该怎么做才能让持久性发挥作用?
谢谢!
汤姆.