Be Circle: Freelance Drupal expertise. Playing full contact Drupal in Toronto.

Be Circle Podcast: Facebook, Widgets, iFrames and IE Pain.

Audio Podcast: 

episode1-01122010.mp3

In today's blog post I try something completely different: a podcast. To listen, just click on the player above.
Today I talk about

• Facebook cookies.
• P3P policies and the P3P policy hack
<?php header('P3P: CP="HONK"'); ?>

• Internet Explorer pain (what else is new). Specifically iFrames. Example after the jump

Internet explorer is fussy about inserting iFrames into a page and then trying to set the iFrame's attributes after its been added to the DOM.

//This won't work the way you expect it to in IE - the iframe border will always show up
//
//lets say I want to inject an iFrame into the DOM
$myWidgetContainer = $('#my-widget-container');
//
//I try something like this with jQuery
$myWidget = $myWidgetContainer.append('<iframe id="my-widget"></iframe>').find('#my-widget');
//
//then I want to set some attributes for this new iFrame
//I pick some attributes
myIFrame.attributes = {height: 500, width: 300, frameBorder: 0, scrolling: 'no', src:'http://example.com'};
//
//I modify the iFrame
$myWidget.attr(myIFrame.attributes);


If you don't want the iFrame to have a border, you need to create the iFrame first and then set the frameBorder (*NOTE* caseSensitive) and scrolling attributes BEFORE inserting the iFrame into the DOM.


//This WILL work the way you expect it to in IE
//
//lets say I want to inject an iFrame into the DOM
$myWidgetContainer = $('#my-widget-container');
//
//first I create an element by hand
myIFrame = document.createElement('iframe');
myIFrame.frameBorder = 0;
myIFrame.scrolling = "no";
myIFrame.id = "my-widget";
//
//jQuery allows me to append a hand built DOM element
$myWidget = $myWidgetContainer.append(myIFrame).find('#my-widget');
//
//then I want to set some attributes for this new iFrame
//I pick some other attributes
myIFrame.attributes = {height: 500, width: 300, src:'http://example.com'};
//
//I modify the iFrame with those additional attributes
$myWidget.attr(myIFrame.attributes);