Fondo transparente de iframe

Question

Mi aplicación tiene un diálogo modal con un iframe dentro de este. Escribí mi código jQuery de manera que cuando se abre el cuadro de diálogo, establece el atributo apropiado 'src' del iframe para que el contenido se cargue. Sin embargo, durante el retraso entre la apertura del diálogo y la carga de contenido, el iframe aparece visiblemente como un cuadro blanco. Prefiero que el iframe tenga un fondo transparente.

He intentado establecer allowtransparency = "yes" en el iframe. ¿Algunas ideas? ¡Gracias!

Answer 1

¿Por qué no simplemente carga el marco fuera de la pantalla u oculta y luego lo muestra una vez que ha terminado de cargarse. Puede mostrar un ícono de carga en su lugar para comenzar, para darle al usuario información inmediata de que se está cargando.

Answer 2

He usado esta creando un marco flotante a través de Javascript y funcionó para mí:

// IFrame points to the IFrame element, obviously 
IFrame.src = 'about: blank'; 
IFrame.style.backgroundColor = "transparent"; 
IFrame.frameBorder = "0"; 
IFrame.allowTransparency="true"; 

No estoy seguro de si hace alguna diferencia, pero me puse esas propiedades antes de agregar el IFrame al DOM. Después de agregarlo al DOM, configuré su src en la URL real.

Answer 3

<style type="text/css"> 
body {background:none transparent; 
} 
</style> 

que podría funcionar (si se pone en el iframe) junto con

<iframe src="stuff.htm" allowtransparency="true"> 

Answer 4

Establecer el color de fondo de la src mejor, y permiten transparencey.

[WITHIN SCR PAGE STYLE] 
<style type="text/css"> 
    body 
    { 
     background:none transparent; 
    } 
</style> 

[IFRAME] 
<iframe src="#" allowtransparency="true">Error, iFrame failed to load.</iframe> 

NOTA: código mi CSS un poco diferente a cómo lo hace el resto.