0

@viewport が Safari Mobile (ipad 2) で機能しない

使えません<meta name="viewport" ... />、cssしか使えません。

UserAgent : Mozilla/5.0 (ipad、...AppleWebKit/534.46...Safari/7534.48.3)

@-webkit-viewport {
 width: 480px;
 zoom: 2.0;
 user-zoom: zoom;
}
@-moz-viewport {
 width: 480px;
 zoom: 2.0;
 user-zoom: zoom;
}
@-ms-viewport {
 width: 480px;
 zoom: 2.0;
 user-zoom: zoom;
}
@-o-viewport {
 width: 480px;
 zoom: 2.0;
 user-zoom: zoom;
}
@viewport {
  width: 480px;
  zoom: 2.0;
  user-zoom: zoom;
}
4

1 に答える 1

0

<meta>またはを介して、何らかの方法でビューポートをトリガーする必要があります<javascript>

[編集]

元のソース

iPhone および iPad の向きに JavaScript を使用する

上記のメタ タグは非常にうまく機能しますが、iPad と iPhone の両方がスクリプト言語をサポートしているため、JavaScript を使用して同じことを行うこともできます。次の JavaScript 関数は、window オブジェクトの innerWidth プロパティを使用し、body 要素の orient 属性を定期的に (この場合は 4 秒ごとに) 設定することで、デバイスのビューポートの向きを検出して設定します。

<script type="text/javascript">
var updateLayout = function() {
  if (window.innerWidth != currentWidth) {
    currentWidth = window.innerWidth;
    var orient = (currentWidth == 320) ? "profile" : "landscape";
    document.body.setAttribute("orient", orient);
    window.scrollTo(0, 1);
  }
};

iPhone.DomLoad(updateLayout);
setInterval(updateLayout, 400);
</script>

上記のスニペットを iPhone/iPad 対応の Web ページの HEAD に配置すると、ディスプレイが適切な向きに設定されます。

于 2013-04-08T14:51:33.707 に答える