// JavaScript Document  Tooltip
// 1. Ejemplo de  como de ir la liga que llama  al tooltip:
// <span  id="tooltip01" style="position:relative; top:0px; left:0px; cursor:pointer;  " onmouseover="mostrarTooltip('tooltip01','arriba','Contenido del span........ ..<br/>siguiente renglon<br/>siguiente renglon y mas texto ')" onmouseout="quitarTooltip();"  > tooltip</span>

// 2. el span debe tener  un identificador propio id="tooltip01",  id="tooltip02",  etc.
// 3. el llamado al script envia tres parametros, el primero corresponde a al identifcador  del id 
// 4. el segundo parametro indica si se muestra arriba o abajo  de la liga
// 5.  El tercer parametro corresponde al contenido  que va a mostrar, respeta  las etiqueas del html


//Los monos son demasiado buenos para que el hombre pueda descender de ellos.Friedrich Nietzsche 
//Los monos son demasiado buenos para que el hombre pueda descender de ellos.Friedrich Nietzsche 


document.write ("<div id='pos' style='position:absolute; display:inline;  top:110px; left:50px; width:140px; height:190px;  background-image:url(botones/tooltip.png); background-repeat:no-repeat; background-color:#transparent; color:#F00; font-size:10px; font-weight:bold; font-family:Verdana, Geneva, sans-serif; padding:5px 5px 5px 5px; border:#CCC 0px solid; text-align:center; z-index:200; visibility:hidden; overflow:hidden;'></div>");

//document.onmousemove= alert("hola");

var posx = 0;
    var posy = 0;
	
function checkS(e){ // esta funcion es llamada desde la etiqueta body
	//alert("holas");
// capture the mouse position
    
    if (!e) var e = window.event;

	
	
	
    if (e.pageX || e.pageY)
    {
        posx = e.pageX;//+"px";
        posy = e.pageY-205;//+"px";
      	//alert ("fire");
  	 }
    else if (e.clientX || e.clientY)
    {
        posx = e.clientX;
        posy = e.clientY;//-205+"px";
		//alert ("explor");
    }
	
	
document.getElementById('fondo_anima').style.right=posx/20+200+"px";
//document.getElementById('fondo_anima').style.top=-posy/20+150+"px";
	document.getElementById('pos_text').innerHTML = 'X='+posx+'</br> Y='+posy;

		if (document.all){
			Xalturabody2=document.body.scrollWidth-200;
			
			
			if (e.clientX >=Xalturabody2  ){
			posx=posx-150;
			}
		
			if (e.clientY >=200  ){
			posy=posy-200;
			}
	
			}// ????????????????????????????
		
		
		if (document.getElementById){
			//alert(window.innerWidth );
			Xalturabody3=window.innerWidth-200;
			
			if (e.pageX >=Xalturabody3  ){
			posx=posx-200;
			
			}
		//alert(e.pagey);
			if (e.pageY <= 200  ){
				
			posy=e.pageY+5;
			}
			
			
			
			}
		
		
		
		
	document.getElementById('pos').style.left = posx+"px";
	document.getElementById('pos').style.top = posy+"px";
	
	
	



	
	
	
	
}


	
function mostrarTooltip(id1, updown2, contenido3){
	document.getElementById('pos').style.height = 190+"px";
	document.getElementById('pos').style.width = 140+"px";
	document.getElementById('pos').style.visibility= 'visible';
	document.getElementById('pos').innerHTML= contenido3;

}


function quitarTooltip(){
	document.getElementById('pos').style.visibility= 'hidden';
	document.getElementById('pos').style.height =1+"px";
	document.getElementById('pos').style.width =1+"px";
	//document.getElementById('pos').style.overflow= 'hidden' ;
}




//Los monos son demasiado buenos para que el hombre pueda descender de ellos.Friedrich Nietzsche 
//Los monos son demasiado buenos para que el hombre pueda descender de ellos.Friedrich Nietzsche