如何在IE8中摆脱iframe的边框

时间:2012-09-13 20:46:21

标签: javascript jquery css iframe internet-explorer-8

我正在创建一个内部有iframe的对话框,问题是边框一直在IE8中显示,这在任何其他浏览器中都能很好地工作。

这是我尝试过的,我也尝试过border:none

$(d.dialog).find('#MyCoolDialogInner').html('<iframe src="/apex/EscalationForm?id={!Case.Id}" height="495" width="380" marginheight="0" marginwidth="0" frameborder="0"/>'); 

提前致谢

5 个答案:

答案 0 :(得分:47)

添加frameBorder属性(注意大写'B')。

所以它看起来像:

<iframe frameBorder="0">Browser not compatible.</iframe>

答案 1 :(得分:4)

您是否尝试过通过CSS进行设置?

iframe {
    border:0px none transparent !important;
}

此外,这些似乎也有效 - marginheight="0" marginwidth="0" frameborder="0"。取自this post on the same IE issue

答案 2 :(得分:2)

试试这个:

<iframe frameborder="no" />

答案 3 :(得分:1)

我意识到IE8对于iFRAMES来说是一种麻烦。 “Frameborder”在HTML5中已弃用,因此虽然它是IE8最简单的选项,但这不是一个长期的解决方案。

我已成功隐藏边框和滚动条,方法是将iFRAME放在容器中。 iFRAME容器本身放置在div内部,以便在网页上进行整体定位。 iFRAME本身是绝对定位的,并且负边距应用于顶部和左侧以隐藏顶部和左侧边框。绝对定位的iFRAME的宽度和高度应编码超过100%,因此它超出了父级大小,直到右边框和底边框不可见(滚动条也不可见)。此技术还使iFrame响应,因为iFRAME容器使用百分比以及容纳容器的div。当然,iFRAME父div必须设置为overflow:hidden。

以下是一个示例代码:

    /*THE PARENT DIV FOR THE iFRAME CONTAINER*/
    .calcontainer
        {
        width:100%;  /*adjust iFrame shrinking here - if floating use percentage until no white space around image.*/   
        max-width:200px;     
        margin:auto;     
        }


    /*THE RELATIVE POSITIONED CONTAINER FOR THE iFRAME*/

    .calinside  /*container for iFRAME - contents will size huge if the container is not contained and sized*/
        {   
        position:relative; /*causes this to be the parent for the absolute iFRAME*/
        padding-bottom: 100%; /* This is the aspect ratio width to height ratio*/
        height: 0;
        overflow:hidden; /*hides the parts of the iFRAME that overflow due to negative margins and over 100% sizing*/     
        }


/*THE ABSOLUTE POSITIONED iFRAME contents WITH NEGATIVE MARGINS AND OVER 100% SIZE IS CODED HERE.  SEE THE NORMAL SETTINGS VERSUS THE IE8 SETTINGS AS MARKED.  A SEPARATE CSS FILE IS NEEDED FOR IE8 WITH A CONDITIONAL STATEMENT IN THE HEAD OF YOUR HTML DOCUMENT/WEB PAGE*/

    .calinside iframe
        {
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;/*must expand to hide white space to the right and below.  Hidden overflow by parent above*/
        height: 103% !important; /*must expand to hide white space to the right and below.  Hidden overflow by parent above*/
        /*IE8*/top: -2%;
        /*IE8*/left: -2%;   
        /*IE8*/width: 114% !important;/*For IE8 hides right border and scroll bar area that is white*/  
        /*IE8*/height: 105% !important; /*hide white space and border below.  Hidden overflow by parent above*/          
        }

答案 4 :(得分:0)

frameborder可以是10,不确定“否”是否为有效值。 Coda在编码时提供有效的值选项,当我对iframe执行此操作时,只能使用1和0。