Many people have talked about highly adaptive IFRAME in the same domain or across small domains and large domains.
I usually try to avoid using IFRAME, but in actual projects, there are a lot of cross-domain IFRAME that is mandatory and mandatory.
This method involves page cooperation and does not support pages that secretly attract others ....
The most widely spread on the Internet is the use of IFRAME intermediary proxy methods.
Of course, this method has many shortcomings, but there is no other way to use it first.
First, prepare a page as a proxy.
Is the original page
An iframe nested in a cross-domain page B
Then, a page C in the same domain as a is placed in the IFRAME of B.
A and B cannot communicate. B and C cannot communicate. But a and c can communicate. B can secretly tell point c what
The purpose is to let a know the height of B so that the IFRAME height can be set based on this height value to achieve highly adaptive.
The reality is that only B knows his height. B cannot tell a, but a means is provided to C. C can tell.
So the solution is that B gets its own height value and sets the src attribute of the IFRAME of its nested C.
C. Get your location and set the IFRAME height in.
/** The page is embedded in iframe B a and B. The iframe c in the same domain as a is embedded in the exotic B page to record the page height of B ***/
/**
*
**/
<IFRAME id = "ifrm" name = "ifrm" frameborder = "0" width = "768" Height = "140" scrolling = "no" src = "http://fe.zuozuo.com /~ Li/tt.html "marginwidth =" 0 "marginheight =" 0 "hspace =" 0 "style =" ">
</Iframe>
/**
* Add the following code to the IFRAME embedded in the B IFRAME page. Pay attention to the document header. <! Doctype HTML>
**/
<IFRAME id = "iframec" name = "iframec" src = "" width = "0" Height = "0" style = "display: none;"> </iframe>
<SCRIPT type = "text/JavaScript">
Function sethash (){
VaR hashh = Document. Body. clientheight + (typeof (document. Body. clienttop) = 'number '? Document. Body. clienttop * 2: 0 );
Urlc = "http: // localhost/lemma/agent.html ";
Document. getelementbyid ("iframec"). src = urlc + "#" + hashh;
}
Window. onload = sethash;
</SCRIPT>
/**
* C IFRAME
**/
<! Doctype HTML>
<HTML xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Title> IFRAME mediation page </title>
</Head>
<Body>
<SCRIPT>
Function pseth (){
VaR iobj = parent.parent.doc ument. getelementbyid ('ifrm ');
Iobloud = parent. Parent. Frames ["ifrm"]. Frames ["iframec"]. Location. Hash;
Iobj. style. Height = iobloud. Split ("#") [1] + "PX ";
}
Pseth ();
</SCRIPT>
</Body>
</Html>
When processing this logic, the performance of various browsers is still cute.
However, there were a lot of surprises in the calculation height of page B.
From document.doc umentelement. scrollheight to document. Body. scrollheight to document. Body. clientheight
It's really tangled .......
If it is a common computing page height, there is no need to do so. It is mainly troublesome to put it in IFRAME.
Sort this part out when you are free ......
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
