Problema al centrar fondo CSS

[matoecatalan]

Hola amigos.

Les vengo a pedir ayuda.
Tengo varios fondos centrados en el mismo CSS. Pero el problema es que el código me funcionó perfecto con posisión: "fixed", ahora yo quiero que continúe centrado pero que al usar la barra de desplazamiento, el fondo no se quede quieto, sino que suba al igual que el contenido. Probe colocandole posisión: "absolute" pero no logre el resultado que quería, los fondos no se visualizaron correctamente y se veía la mitad de ellos solamente.

Aca adjunto el codigo:

<style type="text/css"><!--
body{
background-image: url('imagen1.png'), url('imagen2.png'), url('imagen3.png'), url('imagen4.jpg');
background-position: center center;
background-repeat: no-repeat;
background-attachment: absolute;
background-color: #000000;
}
--></style>


Espero que me puedan ayudar, muchas gracias por leer! Saludos!

[pzin]

Puedes usar el valor scroll en background-attachment, o directamente eliminar background-attachment porque si no se especifica tomará el valor por defecto que es el que quieres; scroll.

[matoecatalan]

Lo intenté, pero el fondo se comportó igual que cuando indico su fijación (attachment) en "absolute". Intento cambiar algo en donde indico su posisión, yo indiqué "center center" ya que si lo cambio no se centra el fono, pero asi mismo no logro nada

[pzin]

En realidad eso de absolute no existe. Los valores que puede tener background-attachment son scroll —por defecto— fixed e inherit.

Si quieres que se mueva junto al resto del sitio, es decir, según su comportamiento normal, elimina directamente background-attachment. Aunque, ya que indicas absolute, no debería de tomarte esa regla ya que no es válida e ignorarla.

Estarás haciendo alguna otra cosa mal o explicándote mal.

[ryugen]

A ver.. En este ejemplo que armé: http://jsfiddle.net/VQHBT/

Tengo las imagenes de fondo centradas y que se mueven junto con el scroll de la página. Es eso lo que se quiere lograr? O es que no estoy entendiendo la consigna?

[pzin]

Iniciado por matoecatalan

ahora yo quiero que continúe centrado pero que al usar la barra de desplazamiento, el fondo no se quede quieto

Yo entendí que quiere que el fondo se mueva, es decir, que tenga un comportamiento normal.

Aunque también es verdad que los casos extraños los entiendo al revés a veces.

[matoecatalan]

Iniciado por Bonez

En realidad eso de absolute no existe. Los valores que puede tener [URL="http://www.librosweb.es/referencia/css/background-attachment.html"]background-attachment[/URL] son scroll —por defecto— fixed e inherit.

Si quieres que se mueva junto al resto del sitio, es decir, según su comportamiento normal, elimina directamente background-attachment. Aunque, ya que indicas absolute, no debería de tomarte esa regla ya que no es válida e ignorarla.

Estarás haciendo alguna otra cosa mal o explicándote mal.

Lo que quiero lograr es que las imagenes de fondo esten centradas, pero que cuando use la barra de desplazamiento este NO se quede quieto y SUBA al igual que el contenido. Espero que se entienda. Intenté sacando el valor "background-attachment" pero el fondo no se centra sino que se sube dejando ver solo la mitad de las imagenes.

Iniciado por ryugen

A ver.. En este ejemplo que armé: [url]http://jsfiddle.net/VQHBT/[/url]

Tengo las imagenes de fondo centradas y que se mueven junto con el scroll de la página. Es eso lo que se quiere lograr? O es que no estoy entendiendo la consigna?

No, porque el fondo en ese ejemplo sigue quieto al usar el scroll de la pagina, yo quiero que al igual que el texto, el fondo suba y se despliegue igual que el contenido.

[pzin]

Pues lo dicho, te bastaría con no definir background-attachment, tal que así:

Código CSS:

body{
background-image: url('imagen1.png'), url('imagen2.png'), url('imagen3.png'), url('imagen4.jpg');
background-position: center center;
background-repeat: no-repeat;
background-color: #000000;
}
 

Así quedarían las cuatro imágenes centradas, sin repetirse y moviéndose junto al resto de la página con un fondo negro.

Si sigue sin funcionar, entonces será alguna otra cosa que tengas mal planteada. En tal caso pásanos una URL para verlo.