var i = 0;


YAHOO.namespace('example.anim');

function fade() {
	var html = '<div style="font-family: Tahoma, Verdana, Arial, sans-serif; padding-top: 35px; padding-left: 20px; color: #FFFFFF;"><div style="color: #FFFFFF; font-weight: bold; padding-bottom: 4px;">' + data[i]['name'] + '</div><div style="float: left; width:175px;"><img src="/store/images/gallery/' + data[i]['photo'] + '"></div><div style="float: left; width:575px;;"><span style="font-size: 10px;">' + data[i]['description'] + '</span></div><div style="clear: both;"></div></div>';
	document.getElementById('size').innerHTML = html;

	setTimeout(fadeout, 5000);
	
	}



function fadein() {   
	i++;
	if (i >= limit) {
		i = 0;
		}

	var html = '<div style="font-family: Tahoma, Verdana, Arial, sans-serif; padding-top: 35px; padding-left: 20px; color: #FFFFFF;"><div style="color: #FFFFFF; font-weight: bold; padding-bottom: 4px;">' + data[i]['name'] + '</div><div style="float: left; width:175px;"><img src="/store/images/gallery/' + data[i]['photo'] + '"></div><div style="float: left; width:575px;;"><span style="font-size: 10px;">' + data[i]['description'] + '</span></div><div style="clear: both;"></div></div>';
	document.getElementById('size').innerHTML = html;


   var attributes = {
      opacity: { to: 100 }
   };
   	var anim = new YAHOO.util.Anim('size', attributes, 1, YAHOO.util.Easing.easeOut);
	anim.duration = 2;
   	anim.animate();


	setTimeout(fadeout, 5000);
	}



function fadeout() {   
	
   var attributes = {
      opacity: { to: 0 }
   };



   	var anim = new YAHOO.util.Anim('size', attributes, 1, YAHOO.util.Easing.easeOut);
	anim.duration = 2;
   	anim.animate();


    setTimeout(fadein, 3000);
   
	}

   YAHOO.util.Event.onDOMReady(fade);