ホームページ > ウェブフロントエンド > jsチュートリアル > content_javascript スキルを使用してフレームの高さの変更を実装する JavaScript メソッド

content_javascript スキルを使用してフレームの高さの変更を実装する JavaScript メソッド

WBOY
リリース: 2016-05-16 15:49:11
オリジナル
1212 人が閲覧しました

この記事の例では、JavaScript を使用してコンテンツに合わせてフレームの高さを変更する方法を説明します。皆さんの参考に共有してください。詳細は以下の通りです。

方法は 2 つあります:

1. 親ページから変更します

ここでは、フレームワークの 2 つの属性、contentWindow と contentDocument を理解する必要があります。これら 2 つの属性の意味は、ウィンドウ ドキュメントの意味と似ていますが、contentWindow はすべてのブラウザーでサポートされているのに対し、contentDocument はサポートされていないという点です。 ie6 と 7、Chrome も同様です。

<iframe onload="change_height()"></iframe>
function change_height(){
  var iframe=document.getElementById("iframe_id");
  //取得框架元素
  var i_height=iframe.contentWindow.document.body.scrollHeight||iframe.contentWindow.document.documentElement.scrollHeight;
  //取得框架内容的高度
  iframe.height=i_height;
  //改变
}

ログイン後にコピー

第二に、コンテンツの変更による

コンテンツページに進む

window.onload=function(){
  var iframe=parent.document.getElementById("iframe_id");
  //取得框架元素
  iframe.height=document.body.scrollHeight||document.documentElement.scrollHeight;
  //取得框架内容的高度并改变
}

ログイン後にコピー

この記事が皆様の JavaScript プログラミング設計に役立つことを願っています。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート