Estaba tratando de hacer algo fondos DIV simples usando un PNG de 1 píxel con transparencia parcial para hacer una caja translúcida para algunos textos sobre una imagen de fondo. Se veía genial en todo tipo de navegadores, hasta que probé el iPhone. Estaba haciendo la transparencia parcial, pero con esta extraña sombra grisácea de la que hablas en vez de los resultados esperados.
Luego probé las pruebas rojas vinculadas & azules. ¡Los dos se veían bien la primera vez que los vi, y luego al actualizarlos, se volvieron grisáceos! Intenté de nuevo con una nueva ventana del navegador y volví a tener el aspecto adecuado, ah, la incoherencia que mencionaste golpea de nuevo. Bueno, entonces hice girar el teléfono de forma ficticia y, a medida que pasaba del modo paisaje al modo retrato, ¡los colores cambiaron a las versiones grisáceas!
Todas las pruebas de transparencia parcial PNG W3C se veían perfectas en el iPhone. Sin embargo, falló la prueba Gamma. Después de descartar la gamma como posible causa, la busqué durante horas, pero no llegué a ninguna parte. Incluso hice un degradado propio que iba del 0 al 100% transparente para asegurarme de que no fuera mi proceso de creación de la imagen. Efectivamente, funcionó perfectamente, así que mi proceso es bueno.
Luego tuve esta genialidad, ¿y si el archivo fuera más grande que 1 píxel? Así que lo hice 2 píxeles de ancho, y 1 píxel de alto, 20% transparente (alfa del 80%). Bam ... ¡funcionó! Probé todo tipo de combinaciones de 1x1, 1x2, 2x1, 2x2, 8x8. Todos funcionaron correctamente excepto por la versión de un solo píxel.
Regresé y verifiqué las pruebas vinculadas anteriores, y veo que usan imágenes de 1 píxel para todos los tonos. ¡Ah, ja!
Y ahí lo tiene, Mobile Safari necesita al menos 2 píxeles para trabajar con archivos PNG semitransparentes.
me he dado cuenta de que esto no es 100% compatibles. Con una carga, lo he visto renderizar perfectamente, hasta la línea del 80 por ciento (donde hay un corte directo a través de la fila 80, gris oscuro debajo de ese punto). Cuando actualizo, el problema está en la página completa (y las recargas posteriores también lo muestran). Estoy pensando que esto puede ser un error particular de mi iPhone, o su software.Intentaré reiniciar, y en su defecto, reinstalar todo el software (y en su defecto, obtener un nuevo teléfono :)). – worksology
Los enlaces están muertos:/ – Will
¿Cerrado como demasiado localizado? Divertidísimo. Esto es generalmente aplicable, y más de 3 años después, sigue siendo 100% relevante con iOS 6 Mobile Safari. –