IE 8 iframe border

Question

Hay un borde que muestra en un iframe y no puedo deshacerme de él.

IE 6 y 7 funciona como es con un poco de 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"; 
} 

Pero la frontera permanece visible en Internet Explorer 8.

Answer 1

HTML de ejemplo para ir con la muestra de JS sería de gran ayuda =)

Intente utilizar las herramientas de desarrollo de IE8 (presione F12 en la página con la que tenga problemas) para aislar qué estilos se están aplicando al marco flotante. También puedes jugar con los estilos allí, para reducir el tiempo de iteración.

Answer 2

Tenga en cuenta que esto puede ser IE no respetando la configuración de borde en el css, mientras que la configuración tradicional del atributo BORDER=0 en el elemento iframe puede funcionar. Vale la pena una prueba, al menos.

Editar: Parece que lo que soluciona el problema es establecer frameborder = '0' en el elemento iframe. Eso funcionó para mí, al menos.

Answer 3

Agregar siguientes atributos a la etiqueta iframe:

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

Answer 4

Yo tenía el mismo problema con marcos flotantes creadas dinámicamente, y resultó que el establecimiento de propiedades de borde DESPUÉS añadiendo el iframe que el documento tiene NO efecto :

El código siguiente muestra un borde 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"; 

Pero esto en realidad lo elimina:

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

la esperanza de que esto ayudaría a resolver su problema.

Answer 5

Probé con muchas variaciones de esta idea y terminé usando algo en esta línea. Pensé que lo compartiría.

<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> 

Luego utiliza etiquetas noscript para entrar en una alternativa para los usuarios no JS, es decir:

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

he comprobado en IE8 y todo es fresco para mí y también valida.

Espero que esto ayude a alguien por ahí!

Answer 6

¡Éxito!

Pruebe esto. Encontrará todos los elementos del iframe y eliminará sus bordes en IE y otros navegadores (aunque puede simplemente establecer un estilo de "border: none;" en navegadores que no sean IE, en lugar de usar JavaScript). Y funcionará incluso si se utiliza DESPUÉS de que el iframe se haya generado y esté en su lugar en el documento (por ejemplo, iframes que se agregan en HTML simple y no en JavaScript).

Esto parece funcionar porque IE crea el borde, no en el elemento iframe como es de esperar, sino en el CONTENIDO del iframe, después de que se crea el iframe en la lista de materiales. ($ @ & * # @ !!! ¡¡¡IE !!!)

Nota: La parte IE solo funcionará (por supuesto) si la ventana principal y el iframe son del MISMO origen (mismo dominio, puerto, protocolo, etc.). De lo contrario, el script obtendrá errores de "acceso denegado" en la consola de errores de IE. Si eso sucede, su única opción es configurarlo antes de que se genere, como otros han notado, o usar el atributo frameBorder no estándar = "0". (O simplemente dejar que IE mirar fugly - mi opción favorita actual;))

me llevó muchas horas de trabajo al punto de la desesperación de resolver esto ...

disfrutar. :)

// ========================================================================= 
// 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. 
     } 
    } 

Answer 7

Si quiere que su código valide, puede hacerlo con javascript. He encontrado la respuesta perfecta cuando tuve este problema hace unos meses here

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); 

f desea cargar otra página sin fisuras en el iframe se puede hacer esto si copia y pega este código en la cabecera de la página . Lo encontré en un sitio con scripts gratuitos. El rendimiento es bueno en la mayoría de los casos

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'; 
} 

Luego, le da a su iframe una identificación y llama al script cuando se carga. Así es como.

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);