var isIE=null;
var testEllipsisElt=null;
var longVersionEllipsis=null;
var ellipsisMotif='...'; //le contenu de l'élement à vous d'y mettre tous l'html que vous souhaitez, img, etc...
var ellipsisTimeoutDuration=2000; //en miliseconde, dureee d'affichage de la version complete
var className='ellipsisDiv'; // class css filtrant les tag a traiter.
var tagName='DIV'; //identification des elemetns a traiter
var ellipsisSuffixe='_ellipsispt'; //id suffixe for ellipsis element.
var ellipsisZIndex=5000; //beaucoup pour etre certain d'eter audessus.
//tag a prendre en compte dans le calcule de l'offset vertical et horizontal
var goodTagForOffset=Array('DIV','P','H1','H2','H3','H4','H5','H6','PRE','TD','TABLE'); //p'etre a complete en fonction de votre besoin
   
/***********************************************/
//function f_replaceEllipsis(className,tagName)
// param : className: non de la classe css filtrant les elements à traiter
// param : type de tag à traiter
// description :
// cette function va regarder si il y a eu overflow
// pour tous les elements repondant au critere tagName.className
/***********************************************/
function f_replaceEllipsis(className,tagName,overFunctionName)
{
	var listTab=document.getElementsByTagName(tagName);
     //pour toutes les cellules du test
	for(i=0 ; i<listTab.length ; i++)
	{
		var obj=listTab[i]; //document.getElementById('div'+i);
		if(obj.className==className)
		{
			var pt=null;
			if(!isIE) // IE implemente cela directement en css avec la commande style="text-overflow:ellipsis;"
			{
			pt=document.getElementById(obj.id+ellipsisSuffixe); //div contenant les signes de depassement (par defaut '...');
			}
             //Largeur affiché de l'élément
			var ll=obj.offsetWidth;
						 //on remplit notre element de test avec le contenu dont il faut mesurer la longueur totale
			testEllipsisElt.innerHTML=obj.innerHTML;
			//on mesure sa largeur
			var L_test=testEllipsisElt.offsetWidth;
             //on test si le contenu depasse la largeur du conteneur
			//en realité on compare la longeur reelle affiche avec la longeur mesurée
			// dans l'element de test sans contraite d'overflow
			if(ll<L_test) // il y a depassement
			{
				if(!isIE) //inutile avec IE
				{
					if(pt==null) //si il n'existe pas d'element '...' dans le dom pour l'element courrament en cours de traitement
					{
					ptmp=document.createElement("div");    //creation de l'ement '...'
					ptmp.id=obj.id+ellipsisSuffixe;        //on lui attribut un id construit a partir de l'id de l'elt en cours de mesure
					ptmp.innerHTML=ellipsisMotif;        
					//mise en place des CSS sur l'element
					ptmp.style.position='absolute';        //obligatoire !!
					ptmp.style.zIndex=ellipsisZIndex;
					ptmp.style.whiteSpace='nowrap';        //fortement conseillé
					ptmp.style.backgroundColor='#FFFFFF';
					//on ajoute cet element au DOM
					document.body.appendChild(ptmp);
					pt=document.getElementById(obj.id+ellipsisSuffixe);
					}
				//on c'est que pt existe maintenant
				}
				
				//on va recupere la position exacte de l'element mesure sur la page
				//on utilise pour cela la propriete offsetTop qui donne la position par rapport au parent
				// c'est pour cela que l'on additionne dans une boucle tout les offsetTop et offsetLeft des parent...                
				var tt=obj.offsetTop;
				var lle=obj.offsetLeft;
				var objTmp=obj.parentNode;
				var jj=0;                                    //anti boucle infine
				while(objTmp!=document.body && jj<1000)    //on limite à 1000 niveau d'imbrication
				{
					 //seul certain element sont a prendre en compte
					//(les tr, row, thead, etc... ne sont pas a prendre en compte)
					if(goodTagForOffset.inArray(objTmp.nodeName))
					{
					tt+=objTmp.offsetTop;
					lle+=objTmp.offsetLeft;
					}
					objTmp=objTmp.parentNode;
					jj++;    
				}
				//voila (lle,tt) forme les coordonnées de obj par rapport a la page...
				//NB, faut p'etre encore prendre en compte le scrolling mais je ne pense pas)
				if(!isIE)
				{
					//on place l'ellipsis
					pt.style.top=tt+'px';
					pt.style.left=lle+ll-pt.offsetWidth+'px';
					pt.style.display='block';
					pt.style.visibility='visible';
				}
					 
				//Mise en place des eventhandler pour le survole
				// cf doc ici : http://nexgenmedia.net/evang/iemozguide/
				if(isIE)
				{ //cf doc ici : http://msdn.microsoft.com/workshop/author/dhtml/reference/methods/attachevent.asp
					obj.attachEvent('onmouseover',ellipsis_onMouseOver);
				}
				else
				{ //cf doc ici : http://www.w3.org/TR/2000/REC-DOM-Level-2-Events-20001113/events.html#Events-Event
					obj.addEventListener('mouseover',ellipsis_onMouseOver,false); //action sans le prefix on
				}
			}
			else
			{
				if(pt!=null && !isIE)
				{
					document.body.removeChild(pt); //on supprime l'ellipsis pour cet element, il n'en a plus besoin
				}
				//on detache les eventHandler de cet element puisqu'il 'rentre' dans son conteneur
				if(isIE)
				{
				obj.detachEvent('onmouseover',ellipsis_onMouseOver);
				}
				else
				{
				obj.removeEventListener('mouseover',ellipsis_onMouseOver,false); //action sans le prefix on
				}
			}
		}
	}
	return;
}

function ellipsis_onMouseOver(aEvent)
{
	var myEvent = aEvent ? aEvent : window.event; //recuperation de l'evenement selon le navigateur
	//on recupere cible de l'evenemet
	var target= myEvent.target ? myEvent.target : myEvent.srcElement;
	//on recupere sa position
	var _top=target.offsetTop;
	var _left=target.offsetLeft;
	var objTmp=target.parentNode;
	var jj=0;                                    //anti boucle infine
	while(objTmp!=document.body && jj<1000)    //on limite à 1000 niveau d'imbrication
	{
		//seul certain element sont a prendre en compte
		//(les tr, row, thead, etc... ne sont pas a prendre en compte)
		if(goodTagForOffset.inArray(objTmp.nodeName))
		{
			_top+=objTmp.offsetTop;
			_left+=objTmp.offsetLeft;
		}
		objTmp=objTmp.parentNode;
		jj++;    
	}
	longVersionEllipsis.innerHTML=target.innerHTML;
	longVersionEllipsis.style.visibility='visible';
	longVersionEllipsis.style.zIndex=ellipsisZIndex+1;
	longVersionEllipsis.style.left=_left;
	longVersionEllipsis.style.top=_top;
	return;
}