2013-09-06 15 views
6

垂直スクロールを有効にし、水平スクロールをオフにしたいとします。Google Chromeでiframeの水平スクロールバーを削除する方法

スクロール= "いいえ"私はまだ垂直スクロールが欲しいからです。

私は、CSS

#myiframe{ 
    overflow-x:hidden; 
    overflow-y:auto; 
    } 

にこれを追加しようとしましたが、それはまだ唯一のクロムのための水平スクロールバーが表示されます。残りのブラウザは問題ありません。

任意のヘルプを使用すると、IFRAMEのソースページへのアクセス権を持っている場合は、そのページの中

body { 
    overflow-x:hidden; 
} 

を配置することができます

+0

http://jsfiddle.net/5DPgf/あなたはiframeのソースへのアクセス権を持っているか、少なくとも同じドメインからのページがありますか? –

+0

です。 overflow-xを使用すると:hiddenはChromeでのみ機能しません。他のすべてのブラウザで動作します。 – alvinb

+0

実際には、iframe *内に*表示されているページにスタイル 'body {overflow-x:hidden;}'(あるいは 'html {overflow-x:hidden;}')を置くと、Chromeでも正しく動作します –

答えて

16

を高く評価しています。あなたにはありませんが、同じドメインからある少なくともページで、私は、親ページからこのようなものが動作するはずと信じている場合:

#myiframe body { 
    overflow-x:hidden; 
} 

上記のいずれにも該当しない場合 - あなたは「オーバーフロー-Xをシミュレートすることができます:hidden "と表示されます。実際にiframeコンテナの内側に水平スクロールバーが表示されます。 IFRAMEの水平スクロールバーが表示されません - インラインフレームの高さが低い高さの容器DIV、例えば:

<div id="myiframecontainer"> 
    <iframe id="myiframe" src="http://en.wikipedia.org" /> 
</div> 

#myiframecontainer { 
    width:600px; 
    height:400px; 
    overflow:hidden; 
} 

#myiframe { 
    width:100%; 
    height:420px; 
} 

に場所Iフレームは、DIVの高さとDIVのオーバーフローが非表示に設定されているよりも大きいです。垂直は依然として有効です。

デモ:

+0

ありがとうございました!これは修正されていないGoogle Chromeの問題のようです。それよりも低い高さのdivに配置することについてのあなたの解決策は一時的な修正です。 – alvinb

+0

オプション3は私が必要としていたものでした。よく考えられた! – nrod

関連する問題