Cómo colocar una imagen fija en css [Resuelto/Cerrado]

guille001 2 Publicaciones lunes, 13 de junio de 2016Fecha de inscripción miércoles, 22 de junio de 2016 Última intervención - 13 jun 2016 a las 18:28 - Última respuesta:  guille001
- 24 jun 2016 a las 21:37
Hola, estoy haciendo mi web y me gustaría que una foto en un div se comporte algo similar a lo que aparece en esta web:

http://www.spenagroup.com/ambientales/

Como ven, al bajar el scroll, se comporta como una ventana donde puedes ver la imagen de fondo, por favor si alguien me puede ayudar a cómo hacer eso estaría muy agradecido.
Ver más 

6 respuestas

Antleiva 36 Publicaciones jueves, 9 de junio de 2016Fecha de inscripción viernes, 24 de junio de 2016 Última intervención - 15 jun 2016 a las 10:39
0
Vota
De hecho es una ventana por así decirlo. Lo único que hacen ahí es poner esa imagen de fondo. Y la parte del body esa "ventana" le han dado una transparencia total, de ahí ese efecto que al bajar se queda fija la imagen pero en realidad esta detrás de fondo. Un saludo.
Es decir que debo de poner una imagen de fondo en el body y que cuadre con el div en transparencia?
Antleiva 36 Publicaciones jueves, 9 de junio de 2016Fecha de inscripción viernes, 24 de junio de 2016 Última intervención - 16 jun 2016 a las 10:15
Exactamente.
guille001 2 Publicaciones lunes, 13 de junio de 2016Fecha de inscripción miércoles, 22 de junio de 2016 Última intervención - 22 jun 2016 a las 15:47
Hola Antleiva, sí me funcionó gracia por la ayuda. Lo malo es que cuando bajo más hay espacios vacíos entre otros div y dejan ver el fondo. Finalmente creo que no va a funcionar ese método con mi web.
Antleiva 36 Publicaciones jueves, 9 de junio de 2016Fecha de inscripción viernes, 24 de junio de 2016 Última intervención - 24 jun 2016 a las 12:51
¿Y no podrías rellenar esos espacios con div con opacidad 1?
guille001 > Antleiva 36 Publicaciones jueves, 9 de junio de 2016Fecha de inscripción viernes, 24 de junio de 2016 Última intervención - 24 jun 2016 a las 21:37
Gracias Antleiva, justo ayer un amigo me dijo que debo de colocar la imagen desde el CSS y luego ponerla fija; aquí comparto lo que explicó y cómo lo hice por si en algún momento también quieran saberlo:

background-attachment:fixed; este le da una posición fija a la imagen como se ve vio en esa página ( http://www.spenagroup.com/ambientales/ ).

background-position:center; Con este lo centré porque mi foto se iba todo para la izquierda.

background-repeat:no-repeat; y con este impedí que se repitiera mi foto

Ejemplo:

#div-imgen{
width:1080px;
height:500px;
background-image:url(image/imagen.png);
background-repeat:no-repeat;
background-position:center;
background-attachment:fixed;
}