jquery
Fondo de imagen completa en web

Probablemente alguna vez, creando una lánding o alguna web necesitareis tener un fondo de imagen completa en la web. Esto normalmente se puede hacer con css con:

background-image: url(‘carpeta/nombreimagen.formato’); 
background-repeat: no-repeat; 
background-size: 100%; 

Pero la cuestión es ¿Puedo poner más de varias imagenes a modo de slider pero de fondo? Sí! yo lo he tenido que hacer hace poco y es sencillo. Se trata de un plugin en JQuery que con un par de archivos creará el fondo que necesitas.

Primero añadimos los archivos JQuery en el header de nuestra web para que los recopile, tal que así:

<code>&lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="/jquery.backstretch.min.js"&gt;&lt;/script&gt;
</code>

A continuación llamamos al JQUERY en nuestro body, por ejemplo así:

<script>// <![CDATA[
jQuery.backstretch([ "http://miweb/imagen1.jpg" //ruta de la primera imagen , "http://miweb/imagen2.jpg" //ruta de la segunda imagen , "http://miweb/imagen3.jpg" //ruta de la tercera imagen , "http://miweb/imagen4.jpg" //ruta de la cuartaimagen ], {duration: 4000, fade: 1000} ); // ]]></script>

Podéis ver una demo y el código aquí: http://srobbin.com/jquery-plugins/backstretch/

Y aquí el archivo JS que estoy utilizando actualmente por si lo queréis descargar directamente -> backstrech