2008-09-17 7 views
10

He visto algunas soluciones para permitir que las imágenes PNG tengan transparencia en Internet Explorer 6, pero aún no he encontrado una que también te permita establecer la posición de fondo en CSS. Si usas sprites, es un factor decisivo. He recurrido al uso de GIF (que no son de alta calidad), no uso imágenes transparentes o sirvo una hoja de estilo completamente diferente a IE6. ¿Existe una solución para IE6 que permita transparencias PNG Y posicionamiento en segundo plano?¿Hay una solución de JavaScript PNG para IE6 que permita el posicionamiento en segundo plano de CSS?

+0

[comprobar esto] (http://www.twinhelix.com/css/iepngfix/) –

+0

que ignora la posición de fondo, colocándolo en la parte superior izquierda por desgracia. –

Respuesta

7

Sí. Convierta sus imágenes para usar palets indexados (png256). Puede admitir transparencia (al igual que gif), pero no un canal alfa.

Puede hacerlo utilizando Irfanview y el complemento pngout, pngquant o pngnq.

el rendimiento del equipo El YUI también hizo un great presentation que cubre esto un muchos otros conceptos de optimización de imagen.

+0

Gracias por ese recurso. – VirtuosiMedia

+0

La falta de canal alfa hace que esta solución no se pueda usar para mi necesidad específica. En cambio, tuve que darle a mi PNG un color de fondo sólido para que coincida con el fondo de la página de forma manual. –

4

This es una nueva técnica que ha surgido en el último mes o así. Desde la página:

En este script, se admiten etiquetas de imagen, tanto con y sin un espaciador GIF en blanco, como con imágenes PNG de fondo, así como repetidas, incluso si son más pequeñas que el elemento de contenido que se encuentran.

+0

Enlace roto :( –

1

en realidad se puede usar CSS puro para obtener imágenes de fondo posicionados con transparencia alfa en IE6 mediante el aprovechamiento de filtros alfa de IE6 y la propiedad CSS clip. Julien Lecomte describes the technique on his blog.

Tenga en cuenta que esta técnica da como resultado un golpe de rendimiento para cada uso de un filtro alfa.

2

Cuando el fondo es estático, uso TweakPNG para cambiar el trozo de Color de fondo en el PNG al color correcto (en lugar del color gris predeterminado). Cualquier navegador regular ignorará esto porque el canal alfa lo invalida, pero IE6 y versiones inferiores usarán ese color en lugar del canal alfa.

Esto significa que tenemos la transparencia en IE7 +, mientras que degradan muy bien en IE6 e inferior. Y todo el posicionamiento CSS y la repetición son posibles (¡porque no hay hacks!).

+0

Me gusta esto! Si hay algo que odio es el hackeo css/html/js específico del navegador. Ahora casi puedo tener una transparencia alfa y aún mantener el css válido. Feliz :) – Gene

Cuestiones relacionadas