Monday, July 9, 2007
IFRAMEs and BASE HREFs
I was disappointed with how long it was taking the Twitter and Flickr badges to load on the home page of sMoRTy71.com, so I decided to go back in internet time and dust off a couple of old HTML friends: the IFRAME and the BASE HREF.
By putting both the Twitter and Flickr badges in separate IFRAMEs, the page will load and then wait for the content of the IFRAMEs to load. Before, the page would hang until both of the badges loaded.
Unfortunately, the Flickr badge wasn't as simple as just sticking the badge code in an IFRAME. Because all of the URLs are served via a script, I couldn't apply link targets to them. This meant that if you clicked on one of the photos in the badge, the Flickr page would load within the IFRAME. Not what I wanted.
After scratching my head for a bit, I remembered the BASE HREF and the fact that you can set a TARGET there. So I added the following code to the HEAD of the Flickr IFRAME HTML:
base href="" target="_parent"
This causes all links within the Flickr IFRAME to load within the parent window.
Now, the home page loads completely regardless of any issues with the badges. Not the most elegant solution, but it works.
I was disappointed with how long it was taking the Twitter and Flickr badges to load on the home page of sMoRTy71.com, so I decided to go back in internet time and dust off a couple of old HTML friends: the IFRAME and the BASE HREF.
By putting both the Twitter and Flickr badges in separate IFRAMEs, the page will load and then wait for the content of the IFRAMEs to load. Before, the page would hang until both of the badges loaded.
Unfortunately, the Flickr badge wasn't as simple as just sticking the badge code in an IFRAME. Because all of the URLs are served via a script, I couldn't apply link targets to them. This meant that if you clicked on one of the photos in the badge, the Flickr page would load within the IFRAME. Not what I wanted.
After scratching my head for a bit, I remembered the BASE HREF and the fact that you can set a TARGET there. So I added the following code to the HEAD of the Flickr IFRAME HTML:
base href="" target="_parent"
This causes all links within the Flickr IFRAME to load within the parent window.
Now, the home page loads completely regardless of any issues with the badges. Not the most elegant solution, but it works.
¶ 8:04 AM 
About Shawn Morton
Married father of 4, social media strategist at Nationwide, consumer electronics enthusiast, hair metal aficionado.
View complete bio.
View complete bio.
Recent Blog Posts 
Our broadband is back Update on new TechRepublic gadget blog The Drobo is here! No broadband until Friday Back to work Started our Fantasy Football league today Maddox' first movie: Knocked Up Going to see QOTSA in August Miles & Mahlon are on the web Samsung Upstage arrived todayBlog Archive
June 2004 July 2004 August 2004 September 2004 October 2004 November 2004 December 2004 January 2005 February 2005 March 2005 April 2005 May 2005 June 2005 July 2005 August 2005 September 2005 October 2005 November 2005 December 2005 January 2006 February 2006 March 2006 April 2006 May 2006 June 2006 July 2006 August 2006 September 2006 October 2006 November 2006 December 2006 January 2007 February 2007 March 2007 April 2007 May 2007 June 2007 July 2007 August 2007 September 2007 October 2007 November 2007 December 2007 January 2008 February 2008 March 2008 April 2008 May 2008 June 2008 July 2008 August 2008 September 2008 October 2008