Foros del Web » Creando para Internet » CSS »

imagen de fondo proporcional pero que se esconda antes de distorsionarse?

Estas en el tema de imagen de fondo proporcional pero que se esconda antes de distorsionarse? en el foro de CSS en Foros del Web. Pues eso queria saber como puedo poner una imagen de fondo que se ajuste al 100 % de la ventana pero que cuando empieces a ...
  #1 (permalink)  
Antiguo 30/09/2011, 02:38
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 22 años, 3 meses
Puntos: 5
imagen de fondo proporcional pero que se esconda antes de distorsionarse?

Pues eso queria saber como puedo poner una imagen de fondo que se ajuste al 100 % de la ventana pero que cuando empieces a cerrarla no se deforme, sino que se esconda. Vamos cuando se empiece a cerrar o cuando sea, que nunca se deforme.

He conseguido que se ajuste pero, se distorsiona.

Algo como esto:

http://http://www.christianwoo.com/

o como esto:

http://www.faustltd.com/

gracias
  #2 (permalink)  
Antiguo 30/09/2011, 04:27
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: imagen de fondo proporcional pero que se esconda antes de distorsionarse?

se trata de hacerlo así
Cita:
html {
display: block;
}

#fondo {
position: absolute;
left: 0;
top: 0;
width: 100%;
z-index: -1;
}

<img id="fondo" src="laimagn" alt="" />
  #3 (permalink)  
Antiguo 30/09/2011, 04:51
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 22 años, 3 meses
Puntos: 5
Respuesta: imagen de fondo proporcional pero que se esconda antes de distorsionarse?

Gracias isabelm por contestar.

En este ejemplo que me pones deja zonas en blanco. En cambio en los ejemplos que os mostraba no se ve ninguna zona en blanco. No se como lo hace realmente.

Es como si cuando estuvieras cerrando la ventana del navegador y se fuera haciendo mas pequeña la foto, llegará a un punto donde no se hiciera mas pequeña de su tamaño real y a partir de ahi se fuera escondiendo foto. En lo que se refiere a horizontalmente y yo creo que en lo que se refiere a verticalmente, lo que hace es esconder la imagen. no se...
  #4 (permalink)  
Antiguo 30/09/2011, 05:13
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: imagen de fondo proporcional pero que se esconda antes de distorsionarse?

entonces no te he entendido. el código que te he dejado se adapta al tamaño del área activa de la pagina. pongamos que tienes una imagen de 1500 x 700, se adaptará a cualquier resolución, horizontalmente, (1024, 1280, etc..) e incluso aunque la ventana esté restaurada. para que se adapte verticalmente también, has de añadirle height: 100%
  #5 (permalink)  
Antiguo 30/09/2011, 05:14
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 22 años, 3 meses
Puntos: 5
Respuesta: imagen de fondo proporcional pero que se esconda antes de distorsionarse?

no pero, fijate en lo que hace la pagina de los ejemplos. Se esconde foto cuando se va haciendo mas pequeña de su tamaño real.
  #6 (permalink)  
Antiguo 30/09/2011, 05:47
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: imagen de fondo proporcional pero que se esconda antes de distorsionarse?

no sé con que navegador lo estás viendo. lo que yo veo que ocurre es lo que ya te he comentado, la imagen se adapta al tamaño del área activa de la página. que justamente es lo que hace el código que te proporcioné
  #7 (permalink)  
Antiguo 30/09/2011, 06:14
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 22 años, 3 meses
Puntos: 5
Respuesta: imagen de fondo proporcional pero que se esconda antes de distorsionarse?

si, pero que siempre sea proporcional y si no puede hacerlo proporcionalmente, que esconda la parte de la imagen que no entraria en la ventana, pero que no se vaya reduciendo.

P.D.: edito el post porque me explique mal.

Última edición por 00israel; 30/09/2011 a las 06:58
  #8 (permalink)  
Antiguo 30/09/2011, 07:31
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: imagen de fondo proporcional pero que se esconda antes de distorsionarse?

la imágenes que se ven tienen 1242 x 900

veamos si es esto otro lo que quieres. añádela al body
Cita:
body {
background: url(imagen);
width: 100%;
height: 100%;
}
  #9 (permalink)  
Antiguo 01/10/2011, 14:09
(Desactivado)
 
Fecha de Ingreso: noviembre-2002
Ubicación: Ciudad Autónoma de Buenos Aires
Mensajes: 2.367
Antigüedad: 21 años, 6 meses
Puntos: 317
Respuesta: imagen de fondo proporcional pero que se esconda antes de distorsionarse?

Yo lo único que veo en esas páginas es spam. En una hay —además— algo que parece javascript (la verdad es que ni me animé a abrir el código).
¿Por qué no la estudias?. Quizá así puedas explicarte mejor.
  #10 (permalink)  
Antiguo 03/10/2011, 02:44
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 22 años, 3 meses
Puntos: 5
Respuesta: imagen de fondo proporcional pero que se esconda antes de distorsionarse?

gracias nuevamente Isabelm. Pero nada, no lo consigo.

Y furoya, eso estoy haciendo pero no le veo lo que realmente han hecho.

seguiré buscando, gracias

Etiquetas: fondo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 19:08.