web-dev-qa-db-ja.com

恐ろしいiframe水平スクロールバーはIEで削除できませんか？

私はiframeを持っています。コンテンツは私が設定している幅よりも広いので、iframeは水平スクロールバーを取得します。 iframeの幅を広げることができないので、スクロールバーを削除したいだけです。 scrollプロパティを「no」に設定しようとしましたが、両方のスクロールバーが強制終了され、垂直バーが必要になります。オーバーフロー-xを「非表示」に設定しようとすると、ffでは水平スクロールバーが強制終了されましたが、IEでは強制終了されませんでした。私にとって悲しい。

internet-exploreriframe
19
mrjrdnthms
scrolling="yes"  horizontalscrolling="no" verticalscrolling="yes"

それをiFrameタグに入れます。

これをCSSでフォーマットしようとしていじくり回す必要はありません。

44
ivor biggun

スクロールバーは<iframe>のプロパティではなく、スクロールバーに含まれるページのプロパティです。内側のページのoverflow-x: hidden要素に<html>を配置してみてください。

25
Jim

Iframeをdiv内に配置してから、divを使用してスクロールすることができます。 IEで問題なく、divのスクロールを制御できます。IE iframeのスクロールに問題があるだけです。これは、トリックを実行する簡単な例です。

<html>
    <head>
        <title>iframe test</title>

        <style>         
        #aTest { 
            width: 120px;
            height: 50px;
            padding: 0;
            border: inset 1px #000;
            overflow: auto;
        }

        #aTest iframe {
            width: 100px;
            height: 1000px;
            border: none;
        }
        </style>
    </head>
    <body>
        <div id="aTest">
            <iframe src="whatever.html" scrolling="no" frameborder="0"></iframe>
        </div>
    </body>
</html>
5
Rich Adams

Iframe内に含まれるページの本文の幅を99％に設定してみることもできます。

0
Toby Artisan

これらの解決策のすべてが私にとってうまくいかなかったか、満足のいくものではありませんでした。スクロール可能なDIVを使用すると、水平スクロールバーをなくすことができますが、その場合は常に垂直スクロールバーがあります。

したがって、すべてのiframeの固定高さを確実に制御できる私のサイトでは、次のソリューションが非常にうまく機能します。 DIVで水平スクロールバーを非表示にするだけです:)

    <!-- This DIV is a special hack to hide the horizontal scrollbar in IE iframes -->
<!--[if IE]>
<div id="ieIframeHorScrollbarHider" style="position:absolute; width: 768px; height: 20px; top: 850px; left: 376px; background-color: black; display: none;">
</div>
<![endif]-->
<script type="text/javascript">
  if (document.getElementById("idOfIframe") != null && document.getElementById("ieIframeHorScrollbarHider") != null)
  {
    document.getElementById("ieIframeHorScrollbarHider").style.display = "block";
  }
</script>
0
Lou
<iframe style="overflow:hidden;" src="about:blank"/>

iEで動作するはずです。 IE6には、overflow-xとoverflow-yのサポートに問題がありました。

もう1つ注意すべき点は、キャメルケースで「frameborder」属性を設定した場合にのみ、iframe上のIEの境界線を削除できることです。

<iframe frameBorder="0" style="overflow:hidden;" src="about:blank"/>

cSSで適切にスタイルを設定できればいいのですが、IEでは機能しません。

0
scunliffe