lojjic / PIE

A behavior for Internet Explorer allowing it to recognize and render various CSS3 box decoration properties
http://css3pie.com
Other
2.79k stars 234 forks source link

PIE.length causes RTE during set up when IFRAME in div #252

Open tomchiverton opened 11 years ago

tomchiverton commented 11 years ago

In pages with constructs like

<button class="redbutton" 
                    >&nbsp;&nbsp;&nbsp;templates&nbsp;&nbsp;&nbsp;</button>

<div style="padding-left:10px;padding-right:10px; height:77%;behavior:none" id="msgTabbedPaneContainer" >
  <iframe height="100%" width="100%" name="body" src="../../../templates/MsgTabbedPane.cfm" style="behavior:none"
    frameborder="no" marginwidth="0" marginheight="0" scrolling="no" noresize></iframe>
</div>

PIE 1.0.0 complains Line: 21 Error: Object doesn't support this property or method

Workaround is to skip part of the PIE.Length which has a very few consequences later on in the method, but we don't hit them

if(parent.appendChild) {
    parent.appendChild( lengthCalcEl );
    while( i-- ) {
        s.width = '100' + units[i];
        conversions[ units[i] ] = lengthCalcEl.offsetWidth / 100;
    }
    parent.removeChild( lengthCalcEl );
}

parent in the above context appears to be the IFRAME tag, removing that tag stops the RTE.

lojjic commented 11 years ago

Oh, now that's a kicker! Since you've named your iframe "body", any references to document.body return the iframe rather than the actual body. I didn't know that IE would override document.body like that.

I suppose we could use document.getElementsByTagName('body')[0] instead. My hunch, though, is that you're going to run into more issues using name="body" since using document.body is a fairly common practice in libraries.

tomchiverton commented 11 years ago

Yup, but unfortunately this is a progressive enhancement of an older site - we can't rename the IFRAME without a lot more work.