IE 8的iframe边框

iframe上显示一个边框,我无法摆脱它。

IE 6和7的工作原理与一点JavaScript:

 function test(){ var iframe = document.getElementById('frame2'); iframe.contentWindow.document.body.style.backgroundColor = "#a31d1d"; iframe.contentWindow.document.body.style.border = "#a31d1d"; iframe.contentWindow.document.body.style.outlineColor = "#a31d1d"; } 

但在IE 8中边界仍然可见。

将以下属性添加到iframe标记中:

 marginheight="0" marginwidth="0" frameborder="0" 

我有与dynamic创build的iframe相同的问题,事实certificate,设置边框属性后,将iframe添加到文档没有影响:

以下代码显示了一个3d边框:

 var iframe = document.createElement("IFRAME"); iframe.src = "http:www.stackoverflow.com"; //Iframe added BEFORE setting border properties. document.body.appendChild(iframe); iframe.frameBorder = "no"; 

但是这实际上消除了它:

 var iframe = document.createElement("IFRAME"); iframe.src = "http:www.stackoverflow.com"; iframe.frameBorder = "no"; //Iframe added AFTER setting border properties. document.body.appendChild(iframe); 

希望这将有助于解决您的问题。

我尝试了大量的这个想法的变化,并最终沿着这些线使用的东西。 以为我会分享。

 <script type="text/javascript"> url = 'http://www.dollypower.com'; title = 'Dolly Power'; width = '660'; height = '430'; document.write('<iframe src='+url+' title='+title+' width='+width+' height='+height+' frameborder=0></iframe>'); </script> 

然后,我使用noscript标签来为非JS用户input一个替代scheme,即:

 <noscript><p><a href="http://www.dollypower.com" target="_blank">Please click here for Dolly Power</a></p></noscript> 

我testing了它在IE8中,这对我来说都很酷,它也validation。

希望这可以帮助那里的人!

成功!

尝试这个。 它会在IE和其他浏览器中find任何iframe元素并删除它们的边框(尽pipe您可以在非IE浏览器中设置“border:none;”样式而不是使用JavaScript)。 并且即使在生成iframe之后使用iframe,也可以在文档中使用iframe(例如添加纯HTML和非JavaScript的iframe)!

这似乎工作,因为IE创build的边框,而不是你所期望的iframe元素,而是iframe的内容 – 在BOM中创buildiframe之后。 ($ @&*#@ !!! !!! IE !!!)

注意:如果父窗口和iframe来自同一个来源(相同的域,端口,协议等),则IE部分将仅工作(当然)。 否则,脚本将在IE错误控制台中出现“访问被拒绝”错误。 如果发生这种情况,您唯一的select就是在生成它之前设置它,或者使用非标准的frameBorder =“0”属性。 (或只是让IE看起来很难受 – 我目前最喜欢的select;))

花了我好几个小时的工作到绝望的地步去弄清楚这个…

请享用。 🙂

 // ========================================================================= // Remove borders on iFrames if (window.document.getElementsByTagName("iframe")) { var iFrameElements = window.document.getElementsByTagName("iframe"); for (var i = 0; i < iFrameElements.length; i++) { iFrameElements[i].frameBorder="0"; // For other browsers. iFrameElements[i].setAttribute("frameBorder", "0"); // For other browsers (just a backup for the above). iFrameElements[i].contentWindow.document.body.style.border="none"; // For IE. } } 

用示例JS去示例HTML会有帮助=)

尝试使用IE8的开发人员工具(按F12在您遇到问题的页面上)来隔离哪些样式正在应用于iframe。 你也可以玩那里的风格,减less你的迭代时间。

请记住,这可能是IE不尊重CSS中的边框设置, 而iframe元素上的属性BORDER=0的传统设置可能会起作用。 至less值得一试。

编辑:它看起来像修复这个问题是在iframe元素上设置frameborder ='0'。 这对我来说至less是有效的。

如果你想让你的代码validation你可以用javascript来做到这一点。 几个月前我遇到这个问题时,我find了完美的答案

 var iframe = document.createElement("iframe"); iframe.src = "banner_728x90.gif"; iframe.width = "728"; iframe.height = "90"; iframe.frameBorder = "0"; iframe.scrolling = "no"; document.body.appendChild(iframe); 

如果要在iframe中无缝加载另一个页面,则可以将此代码复制并粘贴到页面头部。 我发现它在一个免费的脚本网站。 性能在大多数情况下是好的

 function getDocHeight(doc) { doc = doc || document; var body = doc.body, html = doc.documentElement; var height = Math.max( body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight ); return height; } function setIframeHeight(id) { var ifrm = document.getElementById(id); var doc = ifrm.contentDocument? ifrm.contentDocument: ifrm.contentWindow.document; ifrm.style.visibility = 'hidden'; ifrm.style.height = "10px"; // reset to minimal height in case going from longer to shorter doc ifrm.style.height = getDocHeight( doc ) + 10 + "px"; ifrm.style.visibility = 'visible'; } 

然后给你的iframe一个id,并在加载时调用脚本。 这是如何。

 var iframe = document.createElement("iframe"); iframe.setAttribute('id', "ifrm1"); iframe.setAttribute('src', 'http://www.hekcmviw.com/'); // change the URL iframe.setAttribute('width', '100%'); iframe.setAttribute('height', '10'); iframe.setAttribute('frameBorder', '0'); iframe.setAttribute('scrolling', 'no'); iframe.setAttribute('onload' ,"setIframeHeight(this.id)"); document.body.appendChild(iframe);