¿Cómo actúa css3pie?


¿Qué está sucediendo detrás de escena con css3pie que hace que IE pueda usar las características de css3?

Author: Spudley, 2010-10-22

2 answers

El sitio web de CSS3Pie tiene muchos detalles, pero voy a tratar de explicar un poco.

Internet Explorer soporta una característica llamada CSS Behaviors. Esta es una característica específica de IE que le permite especificar la funcionalidad de Javascript para ejecutarse cuando se activa un evento CSS.

Para esto utiliza archivos con una extensión .HTC, que es básicamente código Javascript con una envoltura ligera de código XML personalizado. Dado que Behaviors es una característica específica de IE, no se ha utilizado muy mucho, con la notable excepción de un puñado de hacks similares a CSS3Pie, diseñado para trabajar alrededor de algunas de las deficiencias del navegador.

En el caso de CSS3Pie, implementa varias características que faltan en IE. Estos son el radio del borde, la sombra de caja y el gradiente lineal.

Todas estas cosas pueden hacerse en IE (incluso versiones anteriores), pero de maneras no estándar. Por ejemplo, IE admite un lenguaje de gráficos vectoriales llamado VML (de nuevo, esto es específico de IE). VML permite puede dibujar gráficos usando Javascript, e incluye funciones para crear cuadros con esquinas redondeadas, rellenos de degradado y sombras.

CSS3Pie combina estas características específicas de IE. Como comportamiento CSS, activa código javascript cuando se usa código CSS específico. Este javascript crea elementos adicionales en la página que contiene VML, que luego se estiliza para que coincida con el elemento al que se aplica la clase CSS. El elemento principal se modifica para eliminar la mayoría de los estilos relevantes, de modo que los estilos del elemento VML detrás de él se puede ver.

Al final del día, es un hack. En realidad, no agrega nuevas características a IE; simplemente hace que algunas características existentes de IE funcionen de una manera un poco más estándar.

Si quieres profundizar, CSS3Pie es de código abierto para que puedas estudiarlo. Es un código bastante complejo, sin embargo, por lo que puede encontrar más fácil mirar algunos de los otros (más simples) archivos HTC que también están disponibles.

Antes de CSS3Pie, ya había uno disponible desde HTMlRemix.com que ofrecía esquinas redondeadas y trabajaba de una manera muy similar a CSS3Pie. CSS3Pie es una mejor pieza de software, pero puede encontrar el código HTMLRemix más fácil de entender.

También hay algunos otros que usted puede querer mirar en:

  • Whatever: Hover corrige IE6 para que la característica CSS :hover funcione con todos los elementos HTML en lugar de solo las etiquetas <a>.

  • IE PNG Fix hace que las versiones anteriores de IE funcionen mejor con Gráficos PNG con transparencia.

Espero que eso responda a tu pregunta.

 30
Author: Spudley,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-08-04 07:55:23

Solo usa JavaScript para emular el comportamiento que falta.

 1
Author: takeshin,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-10-23 14:26:22