Expand page height based on iframe source
Since I’m using Mindtouch Core as an intranet site for my company, I have decided to encourage its further use by collecting the various tools and custom sites I have built into one area. Rather than require personnel to have bookmarks to a variety of different tools, I have created a links page within our Wiki, and sub-pages with iframes to each of the internal tools.
The problem is, each iframe within a Wiki page needs it’s height set, and if I statically set it, sooner or later its going to be too big or too small. I want the height of the iframe to scale dynamically with the height of the content in the iframe.
Luckily I found someone who does have a resolution. Full credit goes to John and his post here from 2006.
I will document how I got this to work within a Mindtouch wiki page, as that was the primary source of my problems with this code.
First, you’ll need to create a file with the following code:
Then, transfer this file to the filesystem of your wiki. I placed mine in /var/www/dekiwiki/config.
On the site that you want to appear inside the iframe, you need to add a few things. In the HEAD section:
In the above code, you must make sure your iframe ID matches, and the wrapper ID (I'm using a div tagged as 'container'. Also, the last line should point to the file you put in the wiki filesystem.
Then, in the BODY tag, add:
Now, all that remains is to put an iframe on your wiki page, and then somewhere on the wiki page, paste the following in the WYSIWYG editor:
That's all you need; now the iframe in the wiki page should dynamically expand with the contents!