var event_lists
var events
var currentEvent

function transition(list_index) {
	var from = currentEvent[list_index];
	currentEvent[list_index]++;
	if (currentEvent[list_index] >= events[list_index].length) currentEvent[list_index] = 0;
	var to = currentEvent[list_index];
	events[list_index][from].setStyle('z-index', '10');
	events[list_index][to].setStyle('z-index', '20');
	var fx = new Fx.Style(events[list_index][to], 'opacity', {
		duration: 1000,
		onComplete: function () {
			events[list_index][from].setStyle('opacity', '0');
		} 
	});
	fx.start(0, 1)
}

document.addEvent('domready', function () {
	event_lists = $ES('#supplement .events');
	events = Array(event_lists.length);
	currentEvent = Array(event_lists.length);
	for (var i = 0; i < event_lists.length; i++) {
		events[i] = $ES('li', event_lists[i]);
		currentEvent[i] = 0;
		for (var j = 0; j < events[i].length; j++) {
			events[i][j].setStyle('position', 'absolute');
			events[i][j].setStyle('width', '184px');
			events[i][j].setStyle('height', '164px');
			if (j != 0) events[i][j].setStyle('opacity', '0');
		}
		if (events[i].length > 1) transition.periodical(4000, null, i);
	}
});