0

我一直在尝试让网站缩放以适应 iPad 中的 Portrait 但无济于事.. 这是我的元数据：

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

还将此添加到脚本中：

<script type="text/javascript">
    if(navigator.userAgent.match(/iPad/i)) {
        viewport = document.querySelector("meta[name=viewport]");
        viewport.setAttribute('content', 'width=980');
    }
</script>

在我的查询中的 CSS 上我尝试了这个：

@media only screen and ( min-width: 768px) and ( max-width: 1024px ) {
    body {min-width: 980px;}
}

根据我在这里看到的：

iPad 无法在纵向上正确缩小网站

我也试过身高，但没有用...

这里也有一个类似的问题：

iPad 上的 Safari 在纵向模式下不适合 980 像素宽度的站点

但老实说，我不明白是否有答案（我没有关闭视口..）......

正如我所提到的，看起来不错，但在纵向中，我必须向左滑动才能看到整个画面。最后在移动设备中，它非常适合 320，但是当横向时它仍然保持在 320，所以我认为在缩放时可能是相同的情况....我认为我不必使用 %....但是案子？

4

2 回答 2

1

问题是这个 iOS <5.1 缩放错误 - http://adactio.com/journal/5088/吗？

这在 iOS6 中已修复，但如果您需要它用于旧设备，您可以尝试 -

http://www.blog.highub.com/mobile-2/a-fix-for-iphone-viewport-scale-bug/

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

于 2013-01-24T16:11:45.073 回答
1

也许是由于旧的“方向问题”。

您可能想尝试以下代码：

if (navigator.userAgent.match(/iPad/i)) {
var viewportmeta = document.querySelector('meta[name="viewport"]');
if (viewportmeta) {
    viewportmeta.content = 'width=device-width, minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0';
    jQuery(document).ready(function() {
        document.body.addEventListener('gesturestart', function () {
            viewportmeta.content = 'width=device-width, minimum-scale=0.25, maximum-scale=1.6';
        }, false);
    });
}
}
于 2013-01-25T02:08:38.827 回答