2011-01-26 13 views
5

Estoy tratando de hacer que un fondo estire todo el cuerpo (solo ancho). Esto solo funciona en Chrome, Opera y Firefox. ¿Cómo puedo hacer que esto funcione en IE también? O_oIE tamaño de fondo no funciona

background-size:100%; 
-moz-background-size: auto 100%; 
-o-background-size: auto 100%; 
+1

¿Estás trabajando en IE9? De lo contrario ... es marcado de CSS3. Entonces, no se puede hacer – Marnix

Respuesta

3

desde el fondo de tamaño es CSS3 específico que su va a tener que usar algo como esto para que funcione en IE

Indica tu html y el cuerpo para

html {overflow-y:hidden} 
body {overflow-y:auto} 

envolver la imagen que desea fullscreened con una div # page-fondo

#page-background {position:absolute; z-index:-1} 

a continuación, poner esto en su archivo html

<div id="page-background"> 
    <img src="/path/to/your/image" width="100%" height="100%"> 
</div> 

** tendrá que utilizar algún tipo de reajuste para eliminar los márgenes y rellenos, algo como esto

html, body {height:100%; margin:0; padding:0;} 
+0

Sí, ya lo leí. Pensé que hay una solución de solo CSS: D. Gracias de todos modos – Cristy

0

fondo de tamaño no es compatible con IE para las versiones under 9. Una solución de navegador cruzado es usar un complemento jquery como fullscreenr.

+0

Bien, entonces ignoraré a los usuarios de IE8 en este :)): D – Cristy

4

creé jquery.backgroundSize.js: un plugin jQuery 1.5K que se puede utilizar como punto de retorno para IE8 "cubrir" y "contener" valores. Eche un vistazo al demo.

+0

Hola Louis, he intentado usar tu código pero hay un espacio inexplicable en la parte inferior del navegador IE 8. Cuando alterno abrir y cerrar la consola del elemento de inspección, se muestra perfectamente encontrar, pantalla completa. Pero cuando la página se carga, no es pantalla completa, hay un poco de espacio en la parte inferior. Además, me di cuenta de que cuando carga la página, se corta la parte superior de la imagen, no se muestra el ejemplo que muestra el 9/10 inferior de la imagen y el 1/10 en la parte superior. Después de alternar la consola del elemento de inspección, muestra 10/10 de la imagen. ¿Hay alguna manera de solucionarlo? Espero que entiendas lo que estoy diciendo. – Dr3am3rz