Above you will see my IFrame, it has some really cool content in it but unfortunately it's too big for the IFrame. Click on each of the three links to see three attempts at resizing the IFrame.
- test1 - This will try to resize the frame by simply calling the function on the parent window. Your browser security should stop this (and hopefully alert you).
- test2 - This is the best way. The IFrame that you can see contains another hidden IFrame. "Inner Page" will load a page from mcknut.googlepages.com passing in a width and height parameter. That page will then call a function on "Main Page" passing in those parameters, the IFrame will then resize.
- test3 - This method also works but is not really as good. "Inner Page" will replace its content with a page from mcknut.googlepages.com again passing in the width and height as parameters. That page will then resize the IFrame, before passing back to the original IFrame contents. It a passed in 'callback' parameter but could perhaps use window.history.back().
I have tested this method in all browsers I have available to me (Safari 2.0.4, FF 18.104.22.168, IE 6, Opera 9.02, FF 1.0.7, IE 5 and IE 5.5 Standalone) and they all behaved the same (test1 didn't work, test2 and test3 did).
I was hoping to be able to demonstrate a way of total two-way communication between the IFrame and it's parent page, using another IFrame that I would make new page requests to, but I realised there's no way to have IFrame 1 access IFrame 2 without going via the parent. If someone thinks of a way to do it though let me know.