// JavaScript Document

function mover(id,d){
	var bloque=document.getElementById(id);
	
	var x=(document.defaultView && document.defaultView.getComputedStyle) ?
	document.defaultView.getComputedStyle(bloque,'').getPropertyValue("top") :
	bloque.currentStyle ? bloque.currentStyle.top : "";
	
	var y=(document.defaultView && document.defaultView.getComputedStyle) ?
	document.defaultView.getComputedStyle(bloque,'').getPropertyValue("left") :
	bloque.currentStyle ? bloque.currentStyle.left : "";
	
	x= parseInt(x);
	y= parseInt(y);
	
	if(x == 370){
		d="A";
	}
	if(x == 22){
		d="B";
	}
	
	switch(d){
		case "A":  x -=1; break;
		case "B":  x +=1; break;
		case "D":  y +=1; break;
		case "I":  y -=1; break;
	}
	
	bloque.style.top=x+"px";
	bloque.style.left=y+"px";
	
	if(x < 370 && x > 22){
		setTimeout("mover('"+id+"','"+d+"')",1);
	}
	if(x == 22){ //si la flecha esta arriba cambiamos la flecha a abajo.
		document.getElementById('updown').innerHTML="ocultar";
	}
	if(x == 370){ //si la flecha esta abajo cambiamos la flecha a arriba.
		document.getElementById('updown').innerHTML="mostrar";
	}
}