var pos = 0;

$(document).ready(function(){
    var max = $('#images').children().size();
    //max = max-1;
});


function next()
{
    var max = $('#images').children().size();
    max = max-1;
    
    pos = pos+1;
    if(pos>max)
    {
        pos = 0;
    }
    
    displayCurrent(pos);
}


function prev()
{
    var max = $('#images').children().size();
    max = max-1;
    
    pos = pos-1;

    if(pos<0)
    {
        pos = max;
    }
    
    displayCurrent(pos);
    
    
}


function displayCurrent(id)
{

    //preload
    var image = $('#image'+id).text();

//    var tmpimg = $('<img>').attr('src',image);
//    tmpimg.hide();

//    tmpimg.load(function(){
        $("#mainImage img").attr('src', image);
//    })
    

}