function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
	window.onload = func;
	}else{
	window.onload = function() {
    oldonload();
    func();
    }
  }
}

function addClass(element,value) {
  if (!element.className) {
    element.className = value;
  } else {
    newClassName = element.className;
    newClassName+= " ";
    newClassName+= value;
    element.className = newClassName;
  }
}

function removeClass(element, value){
  var removedClass = element.className;
  var pattern = new RegExp("(^| )" + value + "( |$)");
  removedClass = removedClass.replace(pattern, "$1");
  removedClass = removedClass.replace(/ $/, "");
  element.className = removedClass;
  return true;
}

/*className */
function getElementsByClass(searchClass,node,tag) {
 var classElements = new Array();
 if ( node == null )
  node = document;
 if ( tag == null )
  tag = '*';
 var els = node.getElementsByTagName(tag);
 var elsLen = els.length;
 var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
 for (i = 0, j = 0; i < elsLen; i++) {
  if ( pattern.test(els[i].className) ) {
   classElements[j] = els[i];
   j++;
  }
 }
 return classElements;
}

/*nextSibling*/
function get_nextSibling(n){
	var y = n.nextSibling;
	while (y.nodeType != 1) {
		y = y.nextSibling;
	}
	return y;	
}
/*firstChild*/
function get_firstChild(n){
	var y = n.firstChild;
	while (y.nodeType != 1) {
		y = y.nextSibling;
	}
	return y;		
}
/*lastChild*/
function get_lastChild(n){
	var y = n.lastChild;
	while (y.nodeType != 1) {
		y = y.previousSibling;
	}
	return y;		
}

/*previousSibling*/
function get_previousSibling(n){
	var y=n.previousSibling;
	while (y.nodeType!=1){
	y=y.previousSibling;
	}
	return y;
}


/*onclick function*/
function focus_onclick(){
	
	var focus_box = document.getElementById("focus_num");
	var lis = focus_box.getElementsByTagName("li");
	
		for(var i=0;i<lis.length;i++){
			
			lis[i].onmouseover = function(){atuokey = true;};//key
			lis[i].onmouseout = function(){atuokey = false;};//key			
			
			get_firstChild(lis[i]).onclick = function(){
					var getc = getElementsByClass("current",focus_box,"li");
					if(getc[0].style.width !="192px"){return false;}
					widthElement(getc[0].id,0,f_interval);
					widthElement(this.parentNode.id,f_width,f_interval);
					removeClass(getc[0],"current");
					addClass(this.parentNode,"current");
					focusbigimg(this.parentNode);
			}

		}
}
addLoadEvent(focus_onclick);

/*auto*/
function focusAuto(){
	
	if(atuokey) {return false;}//key
	
	if (!document.getElementById("focus_num")) return false;
	var focus_box = document.getElementById("focus_num");
	var lis = focus_box.getElementsByTagName("li");
	
	var getc = getElementsByClass("current",focus_box,"li");
	li_active();
	
	var getc = getElementsByClass("current",focus_box,"li");
	focusbigimg(getc[0]);
	
	function li_active(){
			var nowID = document.getElementById("c_now");
			if(get_lastChild(focus_box).className == "current" && get_lastChild(focus_box).style.width == f_width+"px" ){
					removeClass(get_lastChild(focus_box), "current");		
					addClass(get_firstChild(focus_box),"current")	
					widthElement(get_lastChild(focus_box).id,0,f_interval);
					widthElement(get_firstChild(focus_box).id,f_width,f_interval);
					return false;
				}
			if(getc[0].style.width == f_width+"px"){
				removeClass(getc[0], "current");			
				addClass(get_nextSibling(getc[0]),"current")
				widthElement(getc[0].id,0,f_interval);
				widthElement(get_nextSibling(getc[0]).id,f_width,f_interval);
				}
	}
}
//addLoadEvent(focusAuto);

	var settime = setInterval('focusAuto()',3000);
	var atuokey = false;
	var f_interval = 30;
	var f_width = 192;

/*imgchange*/
function focusbigimg(obj){	
	var focus_box = document.getElementById("focus_num");
	var lis = focus_box.getElementsByTagName("li");
	
	var focus_pic = document.getElementById("focus_pic");
	var imgs = focus_pic.getElementsByTagName("img");		
	
	for(var i=0;i<imgs.length;i++){
		if (lis[i]==obj){imgs[i].style.display = "block";}
		else{imgs[i].style.display = "none";}
	}
}

/*wdith*/
function widthElement(elementID,final_width,interval) {
  if (!document.getElementById) return false;
  if (!document.getElementById(elementID)) return false;
  var elem = document.getElementById(elementID);
  if (elem.movement) {
    clearTimeout(elem.movement);
  }
  if (!elem.style.width) {
    elem.style.width = "0px";
  }
  var xpos = parseInt(elem.style.width);
  if (xpos == final_width) {
	 return true;	
  }  
  if (xpos < final_width) {
    var dist = Math.ceil((final_width - xpos)/3);
    xpos = xpos + dist;
  }
  if (xpos > final_width) {
    var dist = Math.ceil((xpos - final_width)/3);
    xpos = xpos - dist;
  }
  elem.style.width = xpos + "px";
  var repeat = "widthElement('"+elementID+"',"+final_width+","+interval+")";
  elem.movement = setTimeout(repeat,interval);
}