var loadedImages;
var currentImage = "";
var appImages = new Array();
function loadImages() {
    loadedImages = new Array();
    
    $.each( arrImages, function(key, value){
    //console.log(index);
    

    var image = $('<img />').attr('src', value).attr('id', key).hide();
    
   
    loadedImages[key] = image;
        // Your other custom code
    });
    //console.log(loadedImages);
    appImages = new Array();
    appImages.push(currentImage);
}



function addImagesToCanvas(image) {
   $('#imageCanvas').append(loadedImages[image]);
   appImages.push(image);

}

function navMouseOver(val) {
    //console.log(appImages);
//    if(appImages.length == 0) {
//        $('#imageCanvas').empty();
//
//    }
 if(currentImage != val) {
    if($.inArray(val,appImages) == -1) {
        addImagesToCanvas(val);
    }
    $('#'+currentImage).addClass('ziUnten');
    $('#'+val).addClass('ziOben');
    var prev = currentImage;
     $('#'+currentImage).fadeToggle(500, function () {
            $("#"+prev).removeClass('ziUnten');
        });
     $('#'+val).fadeToggle(500, function () {
            $("#"+currentImage).removeClass('ziOben');
        });
    currentImage = val;
   }
}

$(document).ready(function () {
           // addImagesToCanvas();
    });
function hideIntro() {
 $('.overlay').hide();	
}