3

(悲しいことに) iframe を使用する必要がある一部のコンテンツに問題があります。(これは、うるさいクライアントとドメイン名に関係しています - それは私の手に負えません...)

iframe のあるページは次のとおりです: http://madslund.dk/test/iframepage.html

実際のコンテンツを含むページは次のとおりです: http://madslund.dk/test/content.html

iframe ページは基本的に、他のページのコンテンツを表示するだけです。今のところ問題ありません。

ここに問題があります: 内のコンテンツの幅は設定されています (700px) が、画面に合わせてサイズが変更されます (最大幅: css で 100%)。これは、ブラウザで両方のページを表示している場合は正常に機能しますが、iPhone では、コンテンツ ページを直接表示した場合にのみ機能します。

Javascript: alert(window.outerWidth) は、iframepage.html では (予想どおり) 320 を出力しますが、content.html では 735 を出力します。そのため、iPhone はコンテンツに合わせて iframe のサイズを変更するだけのようです。

4

1 に答える 1

3

iOS 7 では、Mobile Safari がデフォルトで iframe のシームレス属性をオンにしていて、オフにする方法がないようです。(または、少なくとも Mobile Safari で私自身のテストを作成すると、これはケースをつなぎ合わせます。) まだ、IFrame をレスポンシブにし、フレームのスクロールを保持する方法を見つけていませんが、犠牲にする意思がある場合このコードを使用できる垂直スクロール：

HTML:

<iframe scr="content.html" scrolling="no"></iframe>

CSS:

iframe {
    min-width: 100%; 
    width: 100px;
    *width: 100%; 
}

このソリューションはクロス ブラウザーの方法で機能しますが、スクロールを「はい」にするとスクロールしなくなるため、コンテンツの高さを知る必要があることに注意してください。

于 2014-04-04T05:13:54.913 に答える