Home > Web Front-end > JS Tutorial > JavaScript method to implement frame height changing with content_javascript skills

JavaScript method to implement frame height changing with content_javascript skills

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Release: 2016-05-16 15:49:11
Original
1248 people have browsed it

The example in this article describes the method of using JavaScript to change the height of the frame with the content. Share it with everyone for your reference. The details are as follows:

There are two methods:

1. Change through the parent page

Here we need to understand the two attributes of the framework, contentWindow and contentDocument. The meaning of these two attributes is similar to that of window document. The difference is that contentWindow is supported by all browsers, but contentDocument is not supported by ie6 and 7, nor is 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;
  //改变
}

Copy after login

Second, through content changes

Proceed on the content page

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

Copy after login

I hope this article will be helpful to everyone’s JavaScript programming design.

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Issues
What are JavaScript hook functions?
From 1970-01-01 08:00:00
0
0
0
What is JavaScript garbage collection?
From 1970-01-01 08:00:00
0
0
0
c++ calls javascript
From 1970-01-01 08:00:00
0
0
0
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template