Text colorisé avec le pourcentage

Soyez le premier à donner votre avis sur cette source.

Snippet vu 8 232 fois - Téléchargée 29 fois

Commenter

Contenu du snippet

Le texte est colorisé en fonction du pourcentage d'avancement de la progression.

Source / Exemple : 


<HTML>
<HEAD>
<TITLE></TITLE>
<STYLE>
.pct{position: absolute; top: 50px; left: 50px; width: 300px; border-style: outset; border-width: 2px;  padding: 5px; text-align: center;}
.pctBefore{font: 20px Arial; color: #FF0000; clip: rect(0,0,0,0); background-color: #CCCCCC;}
.pctAfter{font: 20px Arial; color: #009966; clip: rect(0,0,0,0); background-color: #EEEEEE;}
</STYLE>
</HEAD>
<BODY>

<DIV ID="pct1" CLASS="pct pctBefore"></DIV>
<DIV ID="pct2" CLASS="pct pctAfter"></DIV>

<SCRIPT>
function ShowPct(pct, str){
	iCurrent = (pct / 100) * pct1.offsetWidth
	pct1.innerHTML = str + pct + " %"
	pct2.innerHTML = str + pct + " %"
	pct2.style.clip = "rect(0," + iCurrent +"," + pct1.offsetHeight + ",0)"
	pct1.style.clip = "rect(0," + pct1.offsetWidth +"," + pct1.offsetHeight + "," + iCurrent +")"
}
//	code test :
for (i=0; i<=100; i++){
	setTimeout("ShowPct("+i+",'Progression en cours ')", 200*i)
}
</SCRIPT>

</BODY>
</HTML>

A voir également

Ajouter un commentaire Commentaire
Xr17 Messages postés 2 Date d'inscription samedi 2 décembre 2006 Statut Membre Dernière intervention 10 décembre 2006
10 déc. 2006 à 20:51
simpas, sa peut etre util
S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (francktfr)