opCard = function()
{
	this.bind = new Array();
	this.index = 0;		
	
	this.style = new Array();
	this.overStyle = false;	
	this.overChange = false;
	this.menu = false;	
	this.nesting = [false,false,"",""];
	
	this.auto = [false, 1000];
	this.timerID = null;	
	this.menutimerID = null;		
	
	this.creat = function(func)
	{
		var _arrMenu = document.getElementById(this.bind[0]).getElementsByTagName(this.bind[1]);
		var _arrInfo = document.getElementById(this.bind[2]).getElementsByTagName(this.bind[3]);
		var my = this, i;
		var argLen = arguments.length;
		var arrM = new Array();
		
		if(this.nesting[0] || this.nesting[1])	
		{	
			var arrMenu = this.nesting[0]?getChilds(_arrMenu,this.bind[0],2):_arrMenu;
			var arrInfo = this.nesting[1]?getChilds(_arrInfo,this.bind[2],3):_arrInfo;
		}
		else
		{
			var arrMenu = _arrMenu;
			var arrInfo = _arrInfo;
		}
		
		var l = arrMenu.length;
		if(l!=arrInfo.length){alert("菜单和内容必须拥有相同的数量\n如果需要，你可以放一个空的在那占位。")}
		
		
		if(this.menu){this.auto=false;this.overChange=true;} 
		
		
		for(i=0;i<l;i++)
		{
			arrMenu[i].cName = arrMenu[i].className;
			arrMenu[i].className = (i!=this.index || this.menu)?getClass(arrMenu[i],this.style[0]):getClass(arrMenu[i],this.style[1]);		
			
			if(arrMenu[i].getAttribute("skip")) 
			{
				if(this.overStyle || this.overChange)	
				{
					arrMenu[i].onmouseover = function(){changeTitle(this, 2);autoStop(this, 0);}
					arrMenu[i].onmouseout = function(){changeTitle(this, 0);autoStop(this, 1);}
				}
				arrMenu[i].onclick = function(){if(argLen==1){func()}}
				arrInfo[i].style.display = "none";
				continue;
			}
			
			if(i!=this.index || this.menu){arrInfo[i].style.display="none"};	
			arrMenu[i].index = i;	
			arrInfo[i].index = i;
			
			
			if(this.overChange)	
			{
				arrMenu[i].onmouseover = function(){changeOption(this);my.menu?changeMenu(1):autoStop(this, 0);}
				arrMenu[i].onmouseout = function(){changeOption(this);my.menu?changeMenu(0):autoStop(this, 1);}
			}
			else	
			{
				arrMenu[i].onclick = function(){changeOption(this);autoStop(this, 0);if(argLen==1){func()}}
				if(this.overStyle)	
				{
					arrMenu[i].onmouseover = function(){changeTitle(this, 2);autoStop(this, 0);}
					arrMenu[i].onmouseout = function(){changeTitle(this, 0);autoStop(this, 1);}
				}
				else	
				{
					if(this.auto[0])	
					{
						arrMenu[i].onmouseover = function(){autoStop(this, 0);}
						arrMenu[i].onmouseout = function(){autoStop(this, 1);}
					}
				}
			}
			
			if(this.auto[0] || this.menu)	
			{
				arrInfo[i].onmouseover = function(){my.menu?changeMenu(1):autoStop(this, 0);}
				arrInfo[i].onmouseout = function(){my.menu?changeMenu(0):autoStop(this, 1);}
			}
		}	
		
		if(this.auto[0])
		{
			this.timerID = setTimeout(autoMove,this.auto[1])
		}
		
		
		function autoMove()
		{
			var n;
			n = my.index + 1;
			if(n==l){n=0};
			while(arrMenu[n].getAttribute("skip"))		
			{
				n += 1;
				if(n==l){n=0};
			}
			changeOption(arrMenu[n]);
			my.timerID = setTimeout(autoMove,my.auto[1]);
		}
		
		
		function autoStop(obj, num)
		{
			if(!my.auto[0]){return;}
			num == 0 ? clearTimeout(my.timerID) : my.timerID = setTimeout(autoMove,my.auto[1]);
		}
		
		
		function changeOption(obj)
		{
			arrMenu[my.index].className = getClass(arrMenu[my.index],my.style[0]);	
			arrInfo[my.index].style.display = "none";	
			
			obj.className = getClass(obj,my.style[1]);		
			arrInfo[obj.index].style.display = "";	
			
			my.index = obj.index;	
		}
		
		function changeTitle(obj, num)
		{
			if(!my.overStyle){return;};
			if(obj.index!=my.index){obj.className = getClass(obj,my.style[num])}
		}
		
		function changeMenu(num)
		{
			if(!my.menu){return;}
			num==0?my.menutimerID = setTimeout(menuClose,1000):clearTimeout(my.menutimerID)
		}
		
		
		function menuClose()
		{
			arrInfo[my.index].style.display = "none";
			arrMenu[my.index].className = getClass(arrMenu[my.index],my.style[0]);
		}
		
		
		function getClass(o, s)
		{
			if(o.cName==""){return s}
			else{return o.cName + " " + s}
		}
		
		
		function getChilds(arrObj, id, num)
		{
			var depth = 0;
			var firstObj = my.nesting[num]==""?arrObj[0]:document.getElementById(my.nesting[num]);		
			do	
			{
				if(firstObj.parentNode.getAttribute("id")==id){break}else{depth+=1}
				firstObj = firstObj.parentNode;
			}
			while(firstObj.tagName.toLowerCase()!="body")	
			
			var t;
			var arr = new Array();
			for(i=0;i<arrObj.length;i++)	
			{
				t = arrObj[i], d = 0;
				do
				{
					if(t.parentNode.getAttribute("id")==id && d == depth)
					{	
						arr.push(arrObj[i]);break;		
					}
					else
					{
						if(d==depth){break};d+=1;
					}
					t = t.parentNode;
				}
				while(t.tagName.toLowerCase()!="body")	
			}
			return arr;
		}
	}
}