GOOGLE ADS

viernes, 29 de abril de 2022

¿El elemento de imagen HTML5 no parece ser compatible con Chrome 52? Srcset no funciona

Acabo de comenzar una nueva página web, por lo que no hay mucho marcado para repasar.

Dejo esto abajo:

<picture>
<source media="(min-width: 1000px)"
srcset="images/largeme.jpg">
<source media="(min-width: 465px)"
srcset="images/medme.jpg">
<img src="images/smallme.jpg"alt="hero profile">
</picture>

y el valor predeterminado es la imagen medme.jpg sin importar el ancho de la ventana. Dejo esto:

<picture>
<source media="(min-width: 1000px)"
srcset="images/largeme.jpg">
<source media="(min-width: 465px)"
srcset="images/medme.jpg">
<!-- <img src="images/smallme.jpg"alt="hero profile">-->
</picture>

comentando la etiqueta de respaldo img y no muestra nada.

Estoy ejecutando Chrome 52, que debería ser compatible con el elemento de imagen. Pero parece estar actuando como si no lo apoyara o algo así. ¿Qué estoy haciendo mal aquí?


Solución del problema

Suena tonto, pero ¿has probado a revertir el orden? Por alguna razón, hacer esto hizo que funcionara para mí.

Entonces, en lugar de:

<picture>
<source media="(min-width: 1000px)"
srcset="images/largeme.jpg">
<source media="(min-width: 465px)"
srcset="images/medme.jpg">
<img src="images/smallme.jpg"alt="hero profile">
</picture>

prueba esto:

<picture>
<source media="(min-width: 465px)"
srcset="images/medme.jpg">
<source media="(min-width: 1000px)"
srcset="images/largeme.jpg">
<img src="images/smallme.jpg"alt="hero profile">
</picture>

No hay comentarios.:

Publicar un comentario

Flutter: error de rango al acceder a la respuesta JSON

Estoy accediendo a una respuesta JSON con la siguiente estructura. { "fullName": "FirstName LastName", "listings...