- ベストアンサー
Operaでのobjectタブの高さ変更
- Operaでのobjectタブの高さを変更する方法について教えてください
- JavaScriptを使用して、読み込むページに合わせてOperaでobjectタブの高さを変更する方法を教えてください
- FireFoxと違ってOperaでobjectタブの高さ変更がうまくいかない場合、どのようにすれば解決できますか
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
小さくする方だったんですね。再現できました^^; 参考ソースでは大きくする方もできなかったので load()の名前変更で大きくできるので解決すると思い込んでしまってました。 で、ちょっといくつか試しましたが、 OperaはObjectタグのheightがそのままコンテンツのbodyのoffsetHeightになってしまうようです。(つけない場合は150pxがデフォ?) Objectタグに height='0'をつければ 0って戻りますし。 SafariもOperaに似た動きしましたが 0pxに設定すると逆にほぼ正しいHeightを返してくれるようになりました。 でもOperaは駄目ですね。 なので、小手先の方法ですが 読み込ませる test2.htm のBODYの内側に<div id="body"></div>を囲んでしまい、 このDIVのoffsetHeightを求めれば、ほどほど正しい値が戻るようです。 読みこませるHTMLファイルが自分の物でこれがかのうなら、なんとか、、 <object onload="loads(this)" id="content" type="text/html" data="./test2.htm" ></object> <script> function loads(obj){ var Height = obj.contentDocument.getElementById('body').offsetHeight alert(Height) obj.height = Height + "px"; } </script> ただ、これだとOpera、Safariだとスクロールバーも出るので、 style指定にして縦も5pxくらい足すとOperaではスクロールバーも出なくなるみたいですね。 ----------test1.htm---------- <html> <body> <object onload="loads(this)" id="content" type="text/html" data="./test2.htm" ></object> <script> function loads(obj){ var Height = obj.contentDocument.getElementById('body').offsetHeight alert(Height) //確認 obj.style.height = Height + 5 + "px"; } </script> </body> </html> ----------test2.htm---------- <html> <body> <div id="body"> test<br> </div> </body> </html>
その他の回答 (2)
- arexis
- ベストアンサー率66% (66/99)
<object onload="loads()" id="content" type="text/html" data=""></object> <script> function loads(){ document.getElementById("content").height=document.getElementById("content").contentDocument.body.offsetHeight+"px"; } </script> 私の環境では、ソース部分の load() 2箇所を loads()にするだけでOperaもFireFoxと同じようにきちんと表示されるので、上手くいかない再現ができないのでちょっとわからないです。
補足
回答をコピペさせていただきましたが、やはり上手くいきません。 objectタグに読ませる内容をどのようにしてもoffsetHeightの値が「150」となります。 できる限り簡単にした以下の2つのファイルを同じフォルダに置きtest1.htmにアクセスすると Firefoxでは「19」、Operaでは「150」とダイアログ表示されます。 ちなみにサーバーはApache2.2.4でOperaのバージョンは9.26です。 ----------test1.htm---------- <html> <body> <object onload="loads()" id="content" type="text/html" data="./test2.htm"></object> <script> function loads(){ alert(document.getElementById("content").contentDocument.body.offsetHeight); } </script> </body> </html> ----------test2.htm---------- <html> <body> test<br> </body> </html>
- arexis
- ベストアンサー率66% (66/99)
Ojbectタグをわざわざ使う理由は何かあるのでしょうから、とりあえずそのままとして。 オンロードで渡す関数名を load() ではなく loads() に変えてみてください。
補足
変えてみましたが、結果は同じでした。 高さを変える他の方法はないでしょうか。
お礼
正しく高さを認識することができました! 僕の最初の質問文がわかりにくかったため、お手数をおかけしてしまいましたが おかげで満足のいくページが構築できそうです。ありがとうございました!