0

div を全画面表示にしたい。
次のような構造があり、div が iframe の外側にある場合にメソッドが機能しますが、iframe を削除できません。

html

<html>
    <body>
        <iframe>
            <div id="contentDiv">Content</div>
        </iframe>
    </body>
</html>

CSS

.Maximized{
    position: absolute;
    top: 0;
    left: 0;
    width:100% !important;
    height:100% !important;
}

ユーザーがブラウザを全画面表示すると、コンテンツ div も全画面表示になるはずです。私のfullscreen-onイベントでは、次のことを行います

$('#contentDiv').addClass('Maximized');

ただし、div はメイン ウィンドウではなく iframe を埋めます。

クラスを追加するだけで div を全画面表示にすることはできますか?

4

3 に答える 3

1

いいえ、iframe も全画面表示にする必要があります。

iframe の内容に関する限り、iframe はウィンドウであるため、iframe 内で全画面表示にすると、iframe のサイズになるだけです。ただし、iframe のサイズを変更してフル ウィンドウにすると、iframe に境界線、パディング、またはマージンがなければ、そのコンテンツもフル ウィンドウになる可能性があります。

于 2013-07-30T22:17:53.633 に答える
0

iframeは が必要srcです。ウィンドウiframeからCSS に直接アクセスすることはできませんが、それは問題ではありません。parentコードは次のようになります。

<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN'
'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'>
  <head>
    <meta http-equiv='content-type' content='text/html;charset=utf-8' />
    <style type='text/css'>
      iframe{
        height:100%; width:100%;
      }
    </style>
  </head>
<body>
  <iframe src='content.html'></iframe>
</body>
</html>
于 2013-07-30T22:30:43.197 に答える
0

このコードを試してください:

<iframe width="100%" height="100%" >
<div id="contentDiv">Content</div>
</iframe>
于 2013-07-30T22:19:55.683 に答える