Hola a todos, tengo una imagen de fondo en un div, y quiero que cuando esa capa se expanda debido a que tenga mucho contenido, la imagen de fondo haga lo mismo.
¿Como puede hacerse?
Gracias y un saludo
| |||
Imagen de fondo que se expanda con el contenido de su capa Hola a todos, tengo una imagen de fondo en un div, y quiero que cuando esa capa se expanda debido a que tenga mucho contenido, la imagen de fondo haga lo mismo. ¿Como puede hacerse? Gracias y un saludo |
| ||||
debería expandirse por defaut ya que es el comportamiento normal... igualmente si "no funciona" podés agregar esto a tu css:
Código:
background-repeat:repeat !important;
__________________ Pasamos tus PSD a HTML Pobre del que lo sabe todo, porque no tiene nada más que aprender ni razón para vivir. - |
| |||
Con CSS puro hoy por hoy es imposible, aunque existen diversas formas de hacerlo a través de javascript (aunque creo que sólo con IE). De todas formas, está previsto que se implemente en el CSS 3, aunque para eso todavía queda xD Aquí tienes la información oficial: [http: // www . w3 . org / TR / css3-background / #the-background-size] Perdona que lo ponga así, que no me deja poner enlaces por ser nuevo :( |
| ||||
Hola: Sin usar javascript, pensé en un truco que he visto que en explorer funciona: Poniendo al body los estilos: position: relative; Y como primer tag la imagen que se quiere de fondo con: position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: -1; También funciona en firefox, pero con un height en el body del 100% (no afecta a explorer). Tampoco sé si vale con los scrolls. Saludos
__________________ Por favor: No hagan preguntas de temas de foros en mensajes privados... no las respondo |
| ||||
apuntando por donde va caricatos, creo que CSS Play propone algo parecido (aunque no me senté a estudiar su código).. Cita: Uf.. falta mucho.. algunas propiedades css3 (por ej. opacity) ya funcionan en Firefox y Opera, pero para que salga del estado de borrador falta mucho, y para que los acepte IE falta aún más (IE aún ni acepta varias de las propiedades CSS 2, así que..)
Iniciado por yz! Css3... ¿Cuando llegará?
__________________ Pasamos tus PSD a HTML Pobre del que lo sabe todo, porque no tiene nada más que aprender ni razón para vivir. - |
| |||
El truco empleado en CSS Play consiste en crear varias capas anidadas, cada una de mayor tamaño que la anterior, y con su correspondiente imagen... Es estandar y válido, pero no es más que un "juguete" irrealizable en la práctica por cuestiones obvias |
| ||||
Cita: me lo podés mostrar? no veo el código al que hacés referencia...solo veo 2 capas, scroller y content
Iniciado por Nigel El truco empleado en CSS Play consiste en crear varias capas anidadas, cada una de mayor tamaño que la anterior, y con su correspondiente imagen... Cita: si las pudieras explicar te agradecería.. el "juguete" de CSS Play está realizado en la prácitca.... aunque creo que te confundistes y CSSP no usa el método que pensás irrealizable en la práctica por cuestiones obvias
__________________ Pasamos tus PSD a HTML Pobre del que lo sabe todo, porque no tiene nada más que aprender ni razón para vivir. - |
| |||
Ups, me he equivocado de ejemplo jejeje, eso me pasa por no comprobarlo primero. Yo me refería a este ejemplo en el que varía la dimensión de una imagen, utilizando para ello varias capas con la imagen en distinto tamaño. Ahora voy a investigar lo de la imagen de fondo, a ver cómo lo hace |
| |||
Ya está analizado :P Lo que hace es ponerle al body dimensiones de 100% y overflow:hidden para que ocupe toda la pantalla y no se expanda con scroll (lo cual es fundamental para lo que hace luego). A continuación, utliza un nuevo div, el el cual, NO utiliza una imagen de fondo, sino que la inserta como elemento img para que así pueda variar su tamaño. Finalmente, para que de la impresión de que es una imagen de fondo (que no se pueda seleccionar, etc...) coloca un nuevo div que ocupe toda la pantalla y emule el scroll que ha perdido el body utlizando overflow:auto, y jugando con los z-index para que el div con la imagen de fondo, permanezca en el fondo e inseleccionable, y el resto de los elementos estén por encima. Vamos, que el truco es original, sí, pero no sé yo si merece la pena... |
| ||||
Nigel, exactamente es como decís es que como dice la web, CSSPlay hace "Experiments with Cascading Style Sheets"
__________________ Pasamos tus PSD a HTML Pobre del que lo sabe todo, porque no tiene nada más que aprender ni razón para vivir. - |