見てみましょう: http://jsfiddle.net/BUNVM/1/
<body>
This is a test page<br/>
(many more lines to make the page scrollable)
This is bottom of the test page<br/>
<iframe id="bot_frame" style="width:250px;height:240px;position:fixed;bottom:0px;right:0px;text-align:left;border:0;"></iframe>
<script type="text/javascript">
var iframe_content = '<!DOCTYPE html><html><body style="background-color:#ddd">Frame content</body></html>';
window.onload = function() {
var iframe = document.getElementById("bot_frame");
iframe.contentWindow.document.open();
iframe.contentWindow.document.write(iframe_content);
iframe.contentWindow.document.close();
};
</script>
</body>
画面の右下隅に静的な iframe があり、document.open() と document.write() と document.close() によってコンテンツが追加されます。
出力フレームだけを開くと、すべて問題ありません。http://jsfiddle.net/BUNVM/1/show/
ただし、Chrome で最後に「#」を付けて同じ出力フレームにアクセスしてみてください: http://jsfiddle.net/BUNVM/1/show/#
ページをスクロールしようとすると、ページが一番下にスタックし、上下にスクロールできません。スクロールバーをドラッグしても、キーボードの矢印キーを押しても機能しません。ただし、マウスをiframeの上に置き、マウスホイール/パッドでスクロールすると、スクロールが機能します。
Ubuntu 12.04 の Chrome v21.0.1180.89 でのみテストできました。
上記は、ハッシュ '#' を使用してページをリロードした場合にのみ発生することに注意してください (既にロードされているページに '#' を追加するだけでは、ページはリロードされません)。
この原因と解決策を教えていただきたいです。