- 締切済み
SafariのIframeで高さが取得できません
<script language="JavaScript"> <!-- function frame_check(){ if(main.document.body){ if(navigator.userAgent.indexOf("Opera") != -1){ // 文字列に「Opera」が含まれている場合 var f = main.document.body.scrollHeight; } else if(navigator.userAgent.indexOf("MSIE") != -1){ // 文字列に「MSIE」が含まれている場合 var f = main.document.body.scrollHeight; } else if(navigator.userAgent.indexOf("Firefox") != -1){ // 文字列に「Firefox」が含まれている場合 var f = main.document.body.offsetHeight; } else if(navigator.userAgent.indexOf("Netscape") != -1){ // 文字列に「Netscape」が含まれている場合 var f = main.document.body.offsetHeight; } else if(navigator.userAgent.indexOf("Safari") != -1){ // 文字列に「Safari」が含まれている場合 var f = main.documentElement.offsetHeight; } if(f) document.getElementById("frame_set").height=f+20; setTimeout("frame_check()",100); }else{ setTimeout("frame_check()",100); } } setTimeout("frame_check()",10); --></script> <iframe name="main" id="frame_set" src="mainf.html" width="800" height="4000" frameborder="0" scrolling="no"></iframe> 上記のスクリプトを作成しましたが、IE7、 Firefoxではうまくいきますが、SafariではIframeに表示するページの高さが取得できません。 どこが問題なのかご教授お願いいたします。
- みんなの回答 (3)
- 専門家の回答
みんなの回答
- pick52
- ベストアンサー率35% (166/466)
いろいろ、調べてみました。 http://d.hatena.ne.jp/onozaty/20060803/p1 http://dogmap.jp/2007/07/19/doctype-%E5%AE%A3%E8%A8%80%E3%81%AB%E3%82%88%E3%82%8B-property-%E3%81%AE%E9%81%95%E3%81%84%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6/ 結局、どのような動作をさせたいのかが分かりませんがもしかすると フレームをフレーム内のサイズと同じにしてフレームと認識させない ようにしたいということでしょうか。 そうなると、セキュリティやマナー上の問題が発生します。 ただ、上記のようにしたい場合は以下のようにしたらいいみたいです。 (なんか調べた結果と異なってなぜか標準モードでも互換モードでも document.documentElement.clientHeightとdocument.body.clientHeightが ブラウザによって取得される値が異なるもののどちらも使用できたり しているみたいですが) function frame_check() { var elm = main.document; var f = elm.documentElement.scrollHeight || elm.body.scrollHeight; if(f) { document.getElementById('frame_set').height = f + 20; } } そして、 iframe に onload="frame_check();" をつけます。 あと、フレームのsrc属性が他のドメインだと正常に値が取得できない ようです。 もし、勘違いがあったらすみません。
- pick52
- ベストアンサー率35% (166/466)
変数定義はブロックの外でした方がいいような気が...。 (JavaScriptってどこで宣言しても関数内は有効だったんだっけ?) ところで、ifの中で同じ記述を繰り返していますがこれだとifの意味が ないような気がします。 function frame_check(){ if(main.document.body) { var elm = main.document.getElementById('frame_set'); var f = elm.scrollHeight || elm.offsetHeight; if(f) { document.getElementById('frame_set').height = f + 20; } } setTimeout("frame_check()",100); } setTimeout("frame_check()",10); としたらどうでしょうか。 (試していないので動作するかどうかの保証はしません)
補足
ご回答ありがとうございます。 しかし結果は変わらずでした。
- kero_mio
- ベストアンサー率90% (94/104)
main.documentElement.offsetHeight の部分が取れないって おっしゃっているんですよね? main.documentElement.offsetHeightの箇所を単純に 「document.getElementById("frame_set").offsetHeight」 にしてあげれば、取得できます。 (Safariで検証しましたので自信はあります) どうぞ、宜しくお願いします。
補足
早速のご回答ありがとうございます。 ご指示のとおり else if(navigator.userAgent.indexOf("Safari") != -1){ // 文字列に「Safari」が含まれている場合 var f = main.documentElement.offsetHeight; } を else if(navigator.userAgent.indexOf("Safari") != -1){ // 文字列に「Safari」が含まれている場合 var f = document.getElementById("frame_set").offsetHeight; } に変更しましたが WindowsXPのsafari(3.12)では高さが取得できずスクロールバーが勝手に可変します。 どこが悪いのでしょうか?何度もすみません。よろしくお願いいたします。
補足
ご回答ありがとうございます。 セキュリティやマナー上の問題とは、どのような問題ですか?すいません素人ですので、教えていただけますか。 ご支持の通り、変更しましたが、結果変わらずでした。 セキュリティやマナー上の問題が大きければ1から出直そうかなと思います。 よろしくお願いいたします。