Live Storm Tracker

To make my website much more interactive, I decided to embed a live tracker for storms in Tornado Alley. After some searching I found an amazing one where you could stream live footage from over 100 storm chasers and comment on the inline feed that was linked to Twitter. It first I thought it would be as easy as reading through their source code, finding and downloading the flash element and then putting it up on my own website. Sadly due to the way their website was structured, most of the content was being stored on separate places within a server and being referred to by the flash element, making it impossible to use. I then decided the best way to include this information would be to use an iframe element to embed their entire web page into my own.

The only problem with this was that I ended up with the whole menu system, ads, logo and footer of the Tornado Alley Live website being visible. The change this, I placed a div element around the iframe and used the following CSS to zoom, fix and scale the contents of the iframe. I also removed the scroll bar from the iframe to make it impossible to accidentally move the contents, as well as keeping the scroll wheel functionality working on the Google maps portion of the embedded web page.

 Here is a screenshot of the live storm tracker and twitter feed running within my web page: