function setOpacity(id, opacity) {
        var obj = document.getElementById(id);
        obj.style.opacity = (opacity / 100);
        obj.style.MozOpacity = (opacity / 100);
        obj.style.KhtmlOpacity = (opacity / 100);
        obj.style.filter = "alpha(opacity=" + opacity + ")";
}


function updateBgImage(id, src) {
        var obj = document.getElementById(id);
        obj.style.backgroundImage = "url("+src+")";
}

function updateFrontImage(id, src) {
        var obj = document.getElementById(id);
        obj.src = src;
}

function arrayToString(arr) {
        return str = 'new Array("' + arr.join('", "') + '")';
}

function initFade(id, par, images) {
        //preload images
        var imageObj = new Image();
        for (x in images) {
                imageObj.src = images[x];
        }
       
        doFadeSet(id, par, images);
}

function fadeIn(id) {
        for (var i=0;i<=10;i++) {
                setTimeout('setOpacity("'+id+'",'+i*10+')',100*i);
        }
}

function fadeOut(id) {
        for (var i=10;i>=0;i--) {
                setTimeout('setOpacity("'+id+'",'+i*10+')', 1000 - (100*i));
        }
}

function doFadeSet(id, par, images) {
        var one = images.pop();
        images.unshift(one);
        var two = images.pop();
        images.unshift(two);
        var imageString = arrayToString(images);
        setOpacity(id, 0);
        updateFrontImage(id, one);
        fadeIn(id);
        setTimeout('updateBgImage("'+par+'", "'+two+'")', 1000);
        setTimeout('updateFrontImage("'+id+'", "'+two+'")', 3000);
        setTimeout('fadeOut("'+id+'")', 2000);
        setTimeout('doFadeSet("'+id+'", "'+par+'", '+imageString+')', 4000);
}
 

<script>
var imageArray = new Array("image1.jpg", "image2.jpg", "image3.jpg", "image4.jpg");
</script>
<div id="container" style="width: 202px; height: 202px; padding 1px;">
<img src="transparent.gif" id="image" style="width: 200px; height: 200px; position: relative; top: 1px; left: 1px; margin: 0; padding: 0;">
</div>

<a href="#" onclick="initFade('image','container', imageArray);">start the slideshow</a>