En este blog en alguna ocasión hemos mostrado las técnicas para utilizar imágenes de background de una página a pantalla completa, dando a la imagen de fondo una personalidad y protagonismo a la altura del texto que muestras en pantalla. Pero en esta ocasión vamos a ir un poco más allá ya que el fondo a la vez que tiene un tamaño a pantalla completa se une un movimiento y cambio de imágenes cómo si fuera un slideshow de fotografías que hemos mostrado también en alguna ocasión. Todo ello hace que tu web sea una experiencia visual y que sea dificil de olvidar si elegimos bien las imágenes de fondo. Todo ello gracias al trabajo de Manoela Ilic para codrops.com
2 comentarios:
Hola!
Primero enhorabuena por tu increible trabajo, tus conocimientos son terribles!
Bueno, el caso es que estoy "lavando la cara de mi blog" y me he enganchado con la imagen de fondo, por más que lo intento no consigo que me ocupe toda la pantalla, he intentado tus trucos y explicaciones pero algo debo hacer mal, quizás no ubico bien los elementos nuevos en la serie de html.
Si me puedes ayudar te lo agradeceria enormemente, Carlos.
Este es mi blog
http://warehouseofrock.blogspot.com.es/
y esta la configuración actual de html para background:
body {
background-image: url('http://www.cooleillinois.com/images/25-Degrees-Restaurant-Classic-Old-Holywood-Furniture-Design-in-Chicago.jpg');
background-attachment : fixed;
margin:0;
color:$textcolor;
font: x-small "Trebuchet MS", Trebuchet, Verdana, Sans-serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}
Muchisimas gracias por adelantado.
Cheers!
Hola Scott St. James! Gracias por los comentarios, sin duda motivan para seguir aportando cosas. Por lo que intentas hacer te recomiendo que eches un vistazo a la siguiente URL
http://www.worldjamblog.com/2011/09/codigo-css-para-usar-una-imagen-de.html
Aparece explicado mejor en código CSS como hacer que tu background ocupe toda la pantalla.
P.D: Buen blog el suyo!
Saludos
Publicar un comentario
Tú comentario/agradecimiento es bienvenido!