我一直在做关于iPod和iPhone 4的Safari视窗问题的一些研究,但我不能找到这个问题的任何答案。 大约有问题会从纵向到横向几个线程,而不是从横向到纵向。 问题如下:
我曾经有从纵向去风景的时候,所以我加了标签的正常缩放问题:
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
因此,修复了某些问题。 现在,当我回到肖像模式,我做了页面被streched并将其与添加的右边缘呈现。 这使得页面更宽,所以你要扫到左侧获得页面的原始位置(认为它保持了新的“右页边距”)。
很抱歉,如果有一个人已经回答了这个,但我只是似乎无法找到这个问题的任何回应。
让我知道你需要一些额外的信息。 请记住这是我的第一个问题:/
谢谢!
编辑:我运行iOS 6,并得到了这个问题。 当我上运行我的网页的iOS 5.1.1它显示正常,所以它可能是那是以前固定视臭虫的新版本。
我想你想要将它添加到你的CSS或样式块。 ( 这是在这个岗位 )
html {
-webkit-text-size-adjust: none; /* Never autoresize text */
}
我发现这个解决方法通过jQuery和CSS。 我不知道它是如何有效的工作,但它是我的需求工作的选项。 基本上,#orient ID标签添加到您的身体标记,然后让具有您所看到的设备出现问题的最大宽度的.ios6移动类。 在我的情况下,它是运行iOS6的iPhone的大小,所以我有一个320像素最大宽度。 这里是jQuery代码。
jQuery的
window.addEventListener("orientationchange", function() {
if(window.orientation == 0){
$("#orient").addClass("io6-mobile");
} else if (window.orientation !== 0){
$("#orient").removeClass("io6-mobile");
}
}, false);
CSS
#orient { /* Don't need any code. Just a helpful ID to pass to jQuery */ }
.ios6-mobile { max-width:320px /* change the width to whatever size your device is */; overflow:hidden; }
希望这有助于以某种方式!
这帮助我解决同样的问题
@media (max-width:640px) and (orientation: landscape) {
body {-webkit-text-size-adjust: 100%;}
}
而对于Retina显示屏的bug
@media (max-width:640px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio:2) {
body {-webkit-text-size-adjust: 70%;}
}