how to detect iframe resize?

Question

i have a page with a function to resize the height of iframe in this page as a height of content of iframe but whene the iframe has a toggle action the height change and the function dosn't detect the resize of the iframe. is there a way to detect if content of my iframe has change...

Answer 1

1 `setInterval(function() { your function}, 800);`
2 add a eventlistener to "onresize" 

you can choose any one

Answer 2

Do both the parent document and the iframe have the same origin? If so, it is easier.

If not, you will need a workaround, that has been already discussed here in Stack Overflow.

It consists of including another iframe inside the iframe, that would point to a special url on the same domain as the top document. This way, the top document and the bottom-most iframe can communicate through JavaScript (since they have both the same origin). This is a production solution I use myself. Some big sites use it, Facebook is known to use (or to have used?) this.

Answer 3

There is this technique to communicate between iframes that doesn't depend on timers which can be, as i've done recently, adapted to resizing of iframes based on the content of the iframe.