0

iframe の高さに関する奇妙な問題に直面しました。

親ページでは、次のように高さ = 900px に設定します。

    <html lang="en-us">
    <head>
       <?php  include_once "./includes/header.php"; ?>
    </head>
    <body>
       <?php include_once "./includes/top.php" ?>
       <?php include_once "./includes/left_nav.php" ?>
       <section id="content">
       <iframe width="100%"  height="900" id="myFrame" src="./modules/ophthalmology/patients.php" scrolling="no" frameborder="0">
       </iframe>
       </section>
       <?php include_once "./includes/footer.php" ?>
     </body>
     </html>

ただし、その中のすべてのコンテンツを表示することはできません。そして、firebugで要素をチェックしたところ、次のことがわかりました。

    <iframe id="myFrame" width="100%" scrolling="no" height="208" frameborder="0" src="./modules/ophthalmology/patients.php">

高さは 208 に変更されます。

しかし、別のモジュールでは、そのソース コード:

    <html lang="en-us">
    <head>
       <?php  include_once "./includes/header.php"; ?>
    </head>
    <body>
       <?php include_once "./includes/top.php" ?>
       <?php include_once "./includes/left_nav.php" ?>
       <section id="content">
       <iframe width="100%"  height="900" id="myFrame" src="./modules/csvfileupload/index.html" scrolling="no" frameborder="0">
       </iframe>
       </section>
       <?php include_once "./includes/footer.php" ?>
     </body>
     </html>

次のように変更されました。

    <iframe id="myFrame" width="100%" scrolling="no" height="930" frameborder="0" src="./modules/csvfileupload/index.html">

これら 2 つの唯一の違いは、src ファイルが異なることです。1 つ目はpatients.php、2 つ目は index.html です。他はすべて同じです。

content の要素を確認しました。css です。

    #content {
       border: 1px solid;
       border-bottom-left-radius: 4px;
       border-bottom-right-radius: 4px;
       margin: 0;
       min-height: 600px;
       overflow: visible;
       padding: 15px 5px 15px 230px;
    }

また、header.php に js 関数があることもわかりました。

    function sizeFrame() {
        var F = document.getElementById("myFrame");
        if(F.contentDocument) {
            F.height = F.contentDocument.documentElement.scrollHeight+30; //FF 3.0.11, Opera 9.63, and Chrome
        } else {
            F.height = F.contentWindow.document.body.scrollHeight+30; //IE6, IE7 and Chrome
        }
    }
    window.onload=sizeFrame;

どうしたの？

4

1 に答える 1

0

が埋め込まれた HTML ドキュメントの場合、JavaScript コードは要素の属性のiframe値に 30 を加算するだけです。これは値 930 を説明しています。ここでの目標と思われるものとは反対に、得られる値はインライン フレーム要素の高さであり、埋め込みドキュメントの固有の高さ要件ではありません。heightiframescrollHeight

HTML 以外の種類の埋め込みドキュメントの場合、奇妙なことが起こることがあります。たとえば、プレーン テキスト ファイルの場合、そのscrollHeight値は、ファイル内の行数から導き出される固有の高さの要件を反映している可能性があります。が要求されたときにサーバーが返すものを知らなくても、./modules/ophthalmology/patients.phpHTML 以外のものであると推測できます。

于 2012-08-11T21:59:54.277 に答える