var slideShow = new Array()

slideShow[0] = "images/Emanuel_andren_home_orrefors.png";
slideShow[1] = "images/Emanuel_andren_home_royaltribute.png";
slideShow[2] = "images/Emanuel_andren_home_rusticharmony.png";
slideShow[3] = "images/Emanuel_andren_home_passionglamour.png";

function fadeinSlideshow(elem, imageList, slideDuration, fadeSpeed, current) {
   
    var listSize = imageList.length;

    if (!current || current >= listSize) current = 0;

    if (!slideDuration) slideDuration = 5000;

    if (!fadeSpeed) fadeSpeed = 1000;
  
    $(elem + " img").attr("src", imageList[current]);
    // If the current element is at the maximum of the element size, then set the 
    // wrapper's background (aka, the next image) to the first image.
    if (current == (listSize - 1)) {
        $(elem).css("background", "transparent url(" + imageList[0] + ") no-repeat");
    } else {
    // If not, set the next image in the list to the background of the wrapper.
        $(elem).css("background", "transparent url(" + imageList[current + 1] + ") no-repeat");
    }
    // Hold the current image for a period of time equal to slideDuration. Once that's done, then
    // fade the current image's opacity until the background image shows. Once that is done, then
    // call this same function again with the next image in line.
    $(elem + " img").animate({ opacity: "1" }, slideDuration).animate({ opacity: "0.01" }, fadeSpeed, function() { $(this).css("opacity", "1"); fadeinSlideshow(elem, imageList, slideDuration, fadeSpeed, current + 1) });
} 

function runSlideshow(){
    fadeinSlideshow("#slideshow", slideShow, 5000, 1000);
}

$(document).ready(runSlideshow);