

<!-- Cache slide images -->

img1 = new Image();
img1.src = "images/slidPic1.jpg";

img2 = new Image();
img2.src = "images/slidPic2.jpg";

img3 = new Image();
img3.src = "images/slidPic3.jpg";

img4 = new Image();
img4.src = "images/slidPic4.jpg";


var i = 0; //ie
var y = 0.0; // other browsers

function showImage() {
   
//fade in top image 2 and 4 over bottom picture

document.getElementById('slide2').style.filter = "alpha(opacity=" + i + ")";
document.getElementById('slide2').style.opacity = y;


if(i<100 || y<1)
    {
    i = i+10;
    y = y+0.1;
    setTimeout("showImage()", 100)
    }
else
    {
   //change bottom picture 1 3      

    //get current picture
     var which = document.getElementById('slide').getAttribute('src');
     // get end of url which is the same in all browsers (url is different in IE 6 and 7)
     var length = which.length;
     var takeaway = length - 19;
     var base = which.substring(takeaway, (length - 4));
     //get pic number from end of url
     var number = base.substring(14, 15);
     //get url without number from end of url
     var base = base.substring(0, 14);
     
     if(number != 3){
	  number = parseInt(number)+ 2;
	var newS = base + number + ".jpg";
	document.getElementById('slide').setAttribute('src', newS);
     }
     else{
	  var newS = base + "1.jpg";
         // alert("Bottom image should go back to one " + newS);
	  document.getElementById('slide').setAttribute('src', newS);
     }


    //reset i and y
//    i = 5;
//    y = 0.05;
    setTimeout("fadeImage()", 8000);
    }

}


function fadeImage()
{

//fade out image

document.getElementById('slide2').style.filter = "alpha(opacity=" + i + ")";
document.getElementById('slide2').style.opacity = y;

if(i>0 || y>0)
    {
    i = i-5;
    y = y-0.05;
    setTimeout("fadeImage()", 100)
    }
else
    {
        
//make sure completely invisible - problem in FF
document.getElementById('slide2').style.filter = 'alpha(opacity=0)';
document.getElementById('slide2').style.opacity = '0.0';

 //get current picture
     var which = document.getElementById('slide2').getAttribute('src');
     // get end of url which is the same in all browsers (url is different in IE 6 and 7)
     var length2 = which.length;
     var takeaway2 = length2 - 19;
     var base2 = which.substring(takeaway2, (length2 - 4));
     //get pic number from end of url
     var number2 = base2.substring(14, 15);
     //get url without number from end of url
     var base2 = base2.substring(0, 14);
     
     if(number2 != 4){
	  number2 = parseInt(number2) + 2;
	var newS = base2 + number2 + ".jpg";
	document.getElementById('slide2').setAttribute('src', newS);
     }
     else{
	  var newS = base2 + "2.jpg";
          //alert("Top image changing to " + newS + "and should now fade in");
	  document.getElementById('slide2').setAttribute('src', newS);
     }
 
    setTimeout("showImage()", 8000);
    }

}