Caucul de la taille en pixels d'une chaîne de caractères

22 déc. 2006, 01:04

Bonjour,

Le code ci-dessous permet d'afficher une bannière déroulante.


<html>
<head>

<title>Test Bannière</title>
<Link REL="stylesheet" TYPE="text/css" HREF="style.css">
		<style type="text/css" media="screen">
		<!--
#defile { position:absolute; margin-top:1px; background-color:transparent; }

</style>

</head>

<body>

  <script language="JavaScript" type="text/javascript">
var defile;// l'element a deplacer 
var psinit = 1000; // position horizontale de depart 
var pscrnt = psinit;  
var montimer; 
     
function texteDefile() { 
   if (!defile) defile = document.getElementById('defile'); 
   if (defile) { 
      if(pscrnt < ( - defile.offsetWidth) ){ 
         pscrnt = psinit; 
                } else { 
         pscrnt+= -1; // pixel par deplacement 
      } 
      defile.style.left = pscrnt+"px"; 
   } 
} 

function startDefile() {
	montimer=setInterval("texteDefile()",5);
	}
	
startDefile();
</script>
  
</p>
<div onMouseOver="clearInterval(montimer)" onMouseOut="startDefile()" style="width:192px" id="defile">Ceci est un message déroulant</div>

</body>
</html>

Il me reste un problème dans l'affichage du texte car je dois prévoir une longueur en pixels (width) fixe alors que je souhaite afficher un texte de longueur variable.

Code : Tout sélectionner

<div onMouseOver="clearInterval(montimer)" onMouseOut="startDefile()" style="width:192px" id="defile">Ceci est un message déroulant</div>

Y-at'il un moyen de calculer la longueur en pixels d'une chaîne de carac tères ?

Merci d'avance.

07 janv. 2007, 15:36

Et tu voudrais faire ça à la volée, de la même manière qu'on peut récupérer les dimensions d'une image?
Pas trouvé. C'est pour cette raison que j'ai développé un module avec une interface graphique qui permet de faire cela à partir du même code JS que celui que tu utilises.
On peut insérer du texte, des images, des images cliquables, des liens, et récupérer le code utile sur http://www.abciweb.net/defilant.php?page=250

09 janv. 2007, 02:54

Cà marche et çà permet d'insérer plus d'objets.

J'ai une solution javascript ci-dessous qui ne permet que du texte mais qui peut rendre service.

Donc pour moi c'est résolu. Merci.

Code : Tout sélectionner


.. code php pour récupérer un texte stocké dans la variable 'banniere' ..

<SCRIPT LANGUAGE="JavaScript">
size=120;
x = 3*size;
place = 0;
texte = "<? echo $banniere ?>";
texteDef = texte;
function defil()
	{
	texteDef = texteDef.substring(1,texteDef.length);
	while(texteDef.length < x)
		{
		texteDef += " ____ " + texte;
		}
	document.defil.defilbox.value = texteDef;
	montimer=setTimeout("defil()", 100)
	}

function startdefil()
	{
	montimer2=setInterval("defil()");
	}

startdefil();  
  
</SCRIPT>

<FORM NAME="defil">
<INPUT TYPE="text" NAME="defilbox" SIZE=120 onmouseover="clearInterval(montimer)" onmouseout="startdefil()">
</FORM>

Caucul de la taille en pixels d'une chaîne de caractères

Qui est en ligne