var matList = [
{ title: 'Legni 1', src: 'img/legni1.jpg'},
{ title: 'Legni 2', src: 'img/legni2.jpg'},
{ title: 'Legni 3', src: 'img/legni3.jpg'},
{ title: 'Legni 4', src: 'img/legni4.jpg'},
{ title: 'Legni 5', src: 'img/legni5.jpg'},
{ title: 'Legni 6', src: 'img/legni6.jpg'},
{ title: 'Legni 7', src: 'img/legni7.jpg'},
{ title: 'Legni 8', src: 'img/legni8.jpg'},
{ title: 'Legni 9', src: 'img/legni9.jpg'},
{ title: 'Legni 10', src: 'img/legni10.jpg'},
{ title: 'Legni 11', src: 'img/legni11.jpg'},
{ title: 'Legni 12', src: 'img/legni12.jpg'}];

var index = 1;
var inche = 2;

function changeMat(index) {
	var img = document.getElementById('imagemat');
	img.alt = img.title = matList[index].title;
	img.src = matList[index].src;
}

function loadNext(inche) {
	var img = document.getElementById('imageload');
	img.alt = img.title = matList[inche].title;
	img.src = matList[inche].src;
}

function nextMat() {
	new Effect.Fade('imagemat', {  
	afterFinish: function() {		
	changeMat(index);
	new Effect.Appear('imagemat');
	loadNext(inche);
	index ++;
	inche ++;
	if (index >= matList.length) index = 1;
	if (inche >= matList.length) inche = 2;
	}
}); 
}

window.setInterval(nextMat, 5000);