Ir directamente al contenido de esta página

codexexempla.org

Nunca pensé que acabaría escribiendo esto, pero recomiendo que esta página se navegue con Internet Explorer 6 o 7.

Anexo: Imágenes, object y Explorer (O la mejor manera de acabar preguntándose «¿merece la pena?»)

En teoría, object puede emplearse para incluir imágenes en un documento. Este código:


    <object type="image/jpeg" width="400" height="271" data="imagenes/gato.jpg"></object>
        

es suficiente para cualquier navegador que haya implementado correctamente la especificación del elemento de HTML (inglés).

Sin embargo, en Internet Explorer 6 y 7 nos encontramos con que, misteriosamente, añade a su alrededor un marco y presenta barras de desplazamiento:

En seguida —pensamos para nuestros adentros— que se trata de algún problema con la implementación de CSS, así que probamos, inocentemente:


    <object […] style="padding:0;overflow:hidden;"></object>
        

¿De donde viene el problema entonces? De la propia implementación de object. Para cuando este elemento se incluyó en HTML 4.01, Internet Explorer 3.0 ya contaba con un elemento propietario con el que incrustar controles de ActiveX en un documento, que no era otro que object. El resultado es el caos con el que nos encontramos ahora.

No obstante, otro de los extraños comportamientos de object nos permite lograr este resultado:

Es posible cargar otro documento HTML en object y hacer desaparecer el marco, siempre y cuando este segundo documento que contiene la imagen cumpla unas condiciones:

  1. No debe incluir la DTD.
  2. Hay que especificar para body un estilo con border:0 y un overflow que sea hidden o visible (?!).

Si se cumplen estas condiciones, para el documento anfitrión el marcado es éste:


    <object type="text/html" width="400" height="271" data="gato.htm"></object>
        

y el marcado mínimo con el que se puede dejar al documento que contiene la imagen es éste:


    <html>
    <body style="padding:0;margin:0;border:0;overflow:hidden;">
        <img src="imagenes/gato.jpg" />
    </body>
    </html>
        

Dejando a un lado el trabajo absurdo de tener que generar un documento adicional por cada imagen que se quiera incluir en una página, surge un pequeño problema si a uno le preocupan las cuestiones de validación: la página anfitriona puede ser válida, pero necesariamente el documento cargado sin DTD no puede serlo. Así, si no se quiere tener que recurrir a JavaScript, sólo queda probar con comentarios condicionales:


    <!--[if IE]>
        <object […] data="gato.htm"></object>
    <![endif]-->
    <!--[if !IE]> <-->
        <object […] data="imagenes/gato.jpg"></object>
    <!--> <![endif]-->
        

Listo. Si alguien quiere tomarse la molestia de hacer todo este trabajo, adelante.

¡Ah, no, se me olvidaba! ¿He dicho antes que object en Explorer carga todo contenido como si fuera un ActiveX? Sí, lo he dicho. Pues eso significa que el documento con la imagen cargará, pero sólo si en Herramientas → Opciones de Internet… → Seguridad se configura ésta a Media baja o a Baja. Con un nivel mayor, no, así que cabe la posibilidad de que tras tanto desvelo el usuario no pueda ver la imagen.

En definitiva, ¿merece la pena?

Volver al curso

(cc) CodexExempla.org, 2007–2021 Mapa del sitio | XHTML | CSS | AA