martes, 3 de enero de 2012

Fullscreen background Slideshow mediante CSS


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

By worldjam with 2 comments

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!

    • Popular
    • Categorías
    • Archivos