Get the App
SLTechnology News&Howtos  ›  Development  › 

How to set Iframe adaptive height in HTML

Shulou Source: shulou.com Published: 2022-06-01 10:36:40 10月04日 Update

Most people do not understand the knowledge points of this article "how to set Iframe adaptive height in HTML", so the editor summarizes the following content, detailed content, clear steps, and has a certain reference value. I hope you can get something after reading this article. Let's take a look at this "how to set Iframe adaptive height in HTML" article.

Mainly the following JS functions:

I. Program code

Function SetWinHeight (obj)

{

Var win=obj

If (document.getElementById)

{

If (win & &! window.opera)

{

If (win.contentDocument & & win.contentDocument.body.offsetHeight)

Win.height = win.contentDocument.body.offsetHeight

Else if (win.Document & & win.Document.body.scrollHeight)

Win.height = win.Document.body.scrollHeight

}

}

}

Finally, if you add iframe, you can't lose the onload attribute. Of course, id must also match the win in the function.

2. Program code:

Let's take a look at the iframe solution in another situation

Important note: the web address you must fill in in src= must be on the same site as this page, otherwise, you will make a mistake and say, "deny access!" (in fact, this is because access is denied because of Js's cross-domain problems.) now I'd like to share with you:

1. Create a bottom.js file, and then enter the following code

Parent.document.all ("frame ID name") .style.height=document.body.scrollHeight

Parent.document.all ("frame ID name") .style.width=document.body.scrollWidth

2. Add each of the included files in your website and pass the test under WINXP and IE6

Realize the adaptive height of iframe

To achieve the adaptive height of iframe, it can automatically adapt to the length of the page to avoid the phenomenon of scrollbars appearing on both the page and the iframe.

Program code

/ / * * iframe automatically adapts to the page * / /

/ / enter a list of the names of iframe whose height you want to automatically adjust according to the height of the page.

/ / separate the ID of each iframe with commas. For example: ["myframe1", "myframe2"], you can have only one form without a comma.

/ / define the ID of iframe

Var iframeids= ["test"]

/ / if the user's browser does not support iframe, whether to hide iframe means to hide yes, no means not to hide

Var iframehide= "yes"

Function dyniframesize ()

{

Var dyniframe=new Array ()

For (iTuno; I

Tags: Height content page code browser browser user program function file article frame knowledge article comma question support adjustment input important Apple Docker Huawei Linux macOS MariaDB Microsoft MySQL NVidia OPPO Reno Docker Microsoft Shulou Information Redmi NVidia