var slide = -1;

Event.observe(window, 'load', function() {

  $$('#slide_show .big_image').each(Element.hide);

  $('slide_show').style.visibility = 'visible';

  showNextSlide();

});

function showNextSlide(){

  var slides = $$('#slide_show .big_image');

  showSlide(slide >= slides.length -1 ? 0 : slide + 1);

}

function showSlide(nextSlide){

  var slides = $$('#slide_show .big_image');

  slides.each(function(e) { e.style.zIndex = 0; });

  slides[nextSlide].style.zIndex = 10;

  new Effect.Appear(slides[nextSlide], { afterFinish: hideOthers });

  slide = nextSlide;

}

function hideOthers(){

    var slides = $$('#slide_show .big_image');

    for (var i = 0; i < slides.length; i++) {

        if (i != slide) {

            Element.hide(slides[i]);

            slides[i].style.zIndex = 0;

        }

    }

//    if (slides[slide].shown) return;

//    slides[slide].shown = true;

    setTimeout(showNextSlide, 4000);

}

document.write('<style type="text/css">#slide_show { visibility: hidden; } </style>');