- 締切済み
iframeのheight可変方法について教えてください
iframeのheight 自動可変 についてのjavascriptはたくさん書き込みがありますが、親ページの<head>~</head>内にscriptの書き込みは不可の場合に実現可能かお教えください。(楽天サイトのため) 【親ページ】 <html> <body> <iframe src="hoge.html(子ページ)" width="900px" height="●●"> </body> </html> 【子ページ】 <head>内など自由に書き込み可能 ●●部分を可変にしたいのですが可能でしょうか? 可能な場合、実際のソースもお教えいただければ幸いです。 宜しくお願いいたします。
- みんなの回答 (3)
- 専門家の回答
みんなの回答
- fujillin
- ベストアンサー率61% (1594/2576)
ご提示の場合、 window.parent.document.getElementsByTagName('iframe')[0].style.height='500px'; または、 window.parent.document.getElementById('a').style.height='500px'; javascriptを理解できるようになってください。
- fujillin
- ベストアンサー率61% (1594/2576)
子フレームのソースにいれます。 <script>タグ内に記入してください。 iframeにidを設定しおいて、以下のような指定の方をお勧めします。 window.parent.document.getElementById('id').style.height='500px';
お礼
ご回答ありがとうございます。 再現ができないため、すみませんが、続けてご質問させてください。 実際ソース: 【oya.html】 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>無題ドキュメント</title> </head> <body> <iframe src="ko.html" scrolling="no" frameborder="0" id="a">このページはインラインフレームを使用しています。インラインフレームに未対応のブラウザをお使いのかたは<a href="・・・">こちら</a>へどうぞ</iframe></td> </body> </html> 【ko.html】 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>無題ドキュメント</title> <script> window.onload = function(){ window.parent.document.getElementsByTagName('id')[0].style.height='500px'; } </script> </head> <body> ・ ・ ・ </body> </html> これで間違いないでしょうか? ●id部分は、ko.html のid部分は、a に書き換えた方がよろしいのでしょうか? ●height='500px' 部分は最低限のheight指定で、実際は可変するのでしょうか? ●実際に使用する際は、<iframe src="ko.html"・・・>部分は、<iframe src="http://www.rakuten.ne.jp/gold/・・・.html"・・・>となりますが、このように他サーバーへのhtml参照で、可変は可能でしょうか? 大変お手数ですが、ご回答いただければ幸いです。 宜しくお願いいたします。
- fujillin
- ベストアンサー率61% (1594/2576)
親の中のiframeがひとつという仮定で、子フレームから以下のように指定 window.onload = function(){ window.parent.document.getElementsByTagName('iframe')[0].style.height='500px'; } iframeにidを設定しておいたほうが、扱いやすいと思いますが…
お礼
ご回答ありがとうございます! まったくの知識不足でお恥ずかしいのですが、 >子フレームから以下のように指定 window.onload = function(){ window.parent.document.getElementsByTagName('iframe')[0].style.height='500px'; } これは、どの部分に書けば宜しいでしょうか? ご教授お願いいたします。
お礼
ご丁寧にありがとうございます。 勉強いたします。