9

¿Hay algún plugin jquery (o de cualquier otra forma) para obligar a IE8 a mostrar varias imágenes de fondo?Múltiples imágenes de fondo IE8

+1

@mu es demasiado corta - No sé qué más decir. El motivo porque quiero tener varios antecedentes es realmente grande y extenso, y no veo cómo eso podría ayudar a responder mi pregunta. – Diego

Respuesta

20

CSS3 múltiples Fondos para Internet Explorer y Mozilla Firefox legado

Esta biblioteca ofrece soporte para múltiples imágenes de fondo para Internet Explorer y Firefox 6-8 < = 3.5 leyendo el código CSS del estilo y las etiquetas de enlace.

El soporte del navegador CSS3 se extiende a la imagen de fondo, posición de fondo, repetición de fondo. Esta biblioteca solo implementa su propia propiedad para la propiedad de fondo del estilo de taquigrafía.

http://plugins.jquery.com/project/multiple-bg

enter image description here

Ejemplo de Uso

Incluyendo la secuencia de comandos

Todo lo que debe ser incluido es la biblioteca jQuery y este script de estas características para trabajo. No se requiere codificación Javascript adicional. ¡La biblioteca minificada tiene solo 8.7kB!

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript" src="jquery.multiple-bgs.js"></script> 

Escribir el CSS

Varios fondos utilizando la propiedad de fondo se leen utilizando esta biblioteca Javascript. Observe cómo se soportan los estados activos y activos.

#ex1 { 
    background: url(middle.gif) repeat-x 0 0; /* For unsupported browsers */ 
    background: url(left.gif) no-repeat 0 0, /* For CSS3 Browsers */ 
       url(right.gif) no-repeat 100% 0, 
       url(middle.gif) repeat-x 0 0; 
} 
#ex1:hover { 
    background: url(middle-hover.gif) repeat-x 0 0; /* For unsupported browsers */ 
    background: url(left-hover.gif) no-repeat 0 0, /* For CSS3 Browsers */ 
       url(right-hover.gif) no-repeat 100% 0, 
       url(middle-hover.gif) repeat-x 0 0; 
} 
#ex1:active { 
    background: url(middle-active.gif) repeat-x 0 0; /* For unsupported browsers */ 
    background: url(left-active.gif) no-repeat 0 0, /* For CSS3 Browsers */ 
       url(right-active.gif) no-repeat 100% 0, 
       url(middle-active.gif) repeat-x 0 0; 
} 
+0

Para aquellos que necesitan un enlace de descarga, puede encontrarlo aquí: http://www.chicowebdesign.com/blog/2010/10/21/updated-jquery-multiple-background-plug-in/ –

+0

@Sonner i consiguió el error siguientes caracteres en IE8 "detalles del error de página web mensaje: objeto espera Línea: 7 Char: 1 Código: 0 URI: file: jquery.multiple-bgs.min.js mensaje: Objeto espera Línea: 13 Char: 1 Código: 0 URI: file: jquery.multiple-bgs.js –

+0

@ eric.itzhak y Soner hacer usted capaz de resolver mi problema, ya que en defino por encima de –

7

CSS3 PIE podría hacer lo que tu buscas CSS3 PIE

+0

css3pie es un pequeño truco fabuloso, pero no sabía que podría hacer CSS múltiples fondos ??? – Spudley

+0

No es algo que haya usado antes, pero planeo hacerlo pronto. Mirando la documentación aquí http://css3pie.com/documentation/supported-css3-features/ se puede hacer usando la propiedad -pie-background. – splatio

+0

Esto funciona bastante bien. Solo una pequeña prueba, asegúrese de probar en el navegador IE8 real - La declaración de -pie-background no hace nada si intenta usar el modo IE8 de IE9. (al menos a partir de la redacción de este comentario) –

5

Si se trata de no más de 3 imágenes como fondo, se puede jugar todo el :before y :after en el css. Vea esto link por ejemplo.

Es posible que tenga que añadir lo siguiente en la cabeza, aunque si quieres IE7 comportarse así:

<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE8.js"></script> 
Cuestiones relacionadas