Slider imagenes con thumbnails

Buenos dias,

Vengo con una consulta, tengo una imagen que ocupa el 100% de la pantalla con una tamaño minimo y maximo de la siguiente manera:

HTML:

Código :

<img  class="fondo" alt="background" src="imagen.jpg" />

CSS:

Código :

.fondo {
position:fixed;
margin-top:0px;
margin: 0 auto;
 z-index:-2; 
max-width: 100%;
min-width: 1200px;
height: auto;
}

Funciona correctamente, pero quiero hacer un slider con thumbnails a partir de esto, osea tener tres miniaturas que al hacer click me cambie esta imagen por la correspondiente.

Se puede realizar una galeria a partir de esto? La imagen no deberia estar dentro de un div ya que pierdo la funcion de hacer que la imagen funcione como fullscreen.

Espero que alguien me ayude.

Saludos.

cabia el atributo src en cada click de los thumbnails

Código Javascript :

$('#thumnail_uno').click(function()
{
    $('.fondo').attr('src', 'fondo1.jpg');
});

y asi con cada thumbnail

Gracias penHolder, funciono perfecto.

Código :

<div class="bgmax">
<img class="bgmax"  alt="background" src="fondo01.jpg" /></div>
<a href="#" class="thumb01" rel="2"><img class="thumb" src="thum01.png" /></a>

Código :

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('.thumb01').click(function()
{
    $('.bgmax img').attr('src', 'fondo2.jpg');

    })
});
</script>

Una pregunta, como puedo asignarle un alpha al cargar la imagen? Asi no es algo tosco al pasar de una imagen a otra.

Código Javascript :

$('.thumb01').click(function()
{ 
    //asignas la imagen
    $('.bgmax img').attr('src', 'fondo2.jpg');
    //la ocultas por defecto
    $('.bgmax img').hide();
    //ahora esperas a que la imagen este totalmente cargada para ejecutar un fade
    $(".bgmax img").bind("load", function () 
    {
        $(this).fadeIn(300); //prueba con distintas duraciones en milisegundos
    });
})

Muchas gracias! Funciono a la perfección!