Sometimes, just sometimes, I want to do something completely ludicrous with my web pages. For instance, just recently I wanted to embed dynamic, externally hosted content in a Blogger page, and I wanted to do it without having internal scroll bars. This meant sizing the iframe hosting the content to precisely fit the content within it, resizing it every time the content changed.
Told you it was ludicrous.
Anyway, I quickly ran into a few problems to do with cross-site scripting. Specifically, when a page is contained in an iframe within a page on a different domain, there are two things you can't do:
It's impossible to size an iframe to its contents from the containing pageIt's impossible to size an iframe to its contents from inside the iframe
So how do I do it? Well, I use a mighty XSS hack! Give this a try:
Create a resizing widget
Create a blogger page called 'resize-widget' that contains the following code: