A highly adaptive IFRAME function is required for the project.
Searching on Google for a long time
Find the following JS
Function setcwinheight (OBJ)
{
VaR CWIN = OBJ;
If (document. getelementbyid)
{
If (CWIN &&! Window. Opera)
{
If (CWIN. contentdocument & CWIN. contentdocument. Body. offsetheight)
CWIN. Height = CWIN. contentdocument. Body. offsetheight + 20;
Else if (CWIN. Document & CWIN. Document. Body. scrollheight)
CWIN. Height = CWIN. Document. Body. scrollheight + 10;
}
}
}
Then ......
The test process is started (the call is simple and skipped first)
1. ie --- there is a slight gap between the height and the size of the scroll bar.
2. FF --- similar to IE, there is a small gap
3. Opera --- you can see the JS conditions.
However, mainstream browsers must use at least these three items !!!
So Google
Search for special phenomena that browsers encounter when processing document. scrollheight or offsetheigth
It is found that when Opera Browser processes IFRAME content, it uses contentWindow
However, when the processing content is high, it is consistent with IE.
Thus, with the following section of JS
<HTML>
<Head>
<SCRIPT>
Function setcwinheight (OBJ)
{
VaR CWIN = OBJ;
If (document. getelementbyid)
{
If (CWIN &&! Window. Opera)
{
If (CWIN. contentdocument & CWIN. contentdocument. Body. offsetheight)
CWIN. Height = CWIN. contentdocument. Body. offsetheight + 20; // FF NS
Else if (CWIN. Document & CWIN. Document. Body. scrollheight)
CWIN. Height = CWIN. Document. Body. scrollheight + 10; // IE
}
Else
{
If(cwin.content+doc ument & cwin.content+doc ument. Body. scrollheight)
CWIN. Height = cwin.content20.doc ument. Body. scrollheight; // Opera
}
}
}
</SCRIPT>
</Head>
<Body>
<IFRAME src = "20103622440.html" onLoad = "setcwinheight (this);" width = "600px">
</Body>
</Html>
In this way, we finally adapted the three browsers.
Be careful as a programmer
Test again
OK... the three browsers are normally displayed, and there is no vertical scroll bar for IFRAME.
My first blog
Don't beat me ~ :)