Google Chromeのヴァージョンを31にアップしたら
とあるサイトのIFrameが表示されないようになりました。
いろいろと追っていくと
IFrameの表示領域を動的に変更している
JSが原因だと判明しました。
下記がそのコードの抜粋です。
(ID名や細かい所は変えています)
HTML部分
<html> <head> <title> TEST </title> </head> <body> <iframe src="http://hogehoge.com/" id="iframe" onload="javascript: iframeResize();"></iframe> </body> </html>
JavaScript部分
<script>
function iframeResize() {
#No. 01
var h = document.getElementById( "iframe" ).contentDocument.height;
// 対象サイトの高さ + 10(マージン)を適用
document.getElementById( "iframe" ).style.height = ( h + 10 ) + "px";
}
</script>
上記のコードだと
No.01の部分の変数[contentDocument]に
対して変数[height]というものが
格納されていなかったので【10px】のみが適用されます。
というわけで、Google DevToolで追っかけて
上記の「JavaScript部分」を下記のコードに変更しました。
JavaScript部分
<script>
function iframeResize() {
var h = document.getElementById( "iframe" ).contentDocument.documentElement.offsetHeight;
// 対象サイトの高さ + 10(マージン)を適用
document.getElementById( "iframe" ).style.height = ( h + 10 ) + "px";
}
</script>
という訳で対象変数がまるっと変わっています。
自身の環境上ではこれで上手く動作できました。
ここにリンクを対象コードを記載したファイルへの
リンクを貼って置きますのでほしい方はご自由にどうぞ。