function headAnim()
{
	var szNormal = 192, szSmall = 113, szFull = 510;
	 
	var box = $$("#box .box");
	var fx = new Fx.Elements(box, {wait: false, duration: 1000, transition: Fx.Transitions.linear});
	box.each
	(
		function(bx, i)
		{
			bx.addEvent
			(
				"mouseenter",
				function(event)
				{
					var o = {};
					o[i] = {width: [bx.getStyle("width").toInt(), szFull]}
					box.each
					(
						function(other, j)
						{
							if(i != j)
							{
								var w = other.getStyle("width").toInt();
									if(w != szSmall)
										o[j] = {width: [w, szSmall]};
							}
						}
					);
					fx.start(o);
				}
			);
		}
	);
	 
	$("box").addEvent
	(
		"mouseleave",
		function(event)
		{
			var o = {};
			box.each
			(
				function(bx, i)
				{
					o[i] = {width: [bx.getStyle("width").toInt(), szNormal]}
				}
			);
			fx.start(o);
		}
	)
}

var currItemIdx = 1;
var itemCount = 5;

function footAnim()
{
	var items = $$("#articleList .item");
	var tempItemIdx = currItemIdx;

	items.each
	(
		function(item, i)
		{
			if (currItemIdx == i)
			{
				tempItemIdx = ++i;
				item.setStyles({display: "block", opacity: 0});
			}
			else
			{
				item.setStyles({display: "none"});
			}
			new Fx.Style(item, "opacity", {duration: 1000} ).start(1);
		}
	);
	currItemIdx = tempItemIdx % itemCount;
}

window.addEvent('domready', headAnim, footAnim.periodical(5000));