Mise à jour : 2012-05-16
Équivalent de progressmeter dans le langage XUL, cette balise qui conforte la position de HTML5 comme langage applicatif et non plus seulement comme langage descriptif, permet de donner l'état d'avancement d'une tâche.

<progress>

  • value : attribut désignant la valeur actuel de l'état d'avancement
  • max : attribut indiquant la valeur maximale à atteindre
  • position : attribut en lecture seule indiquant le pourcentage d'avancement

Notes sur le tuto

  • Le visuel de barre de progression animée, qui avait disparu après Chrome 7.0.517, est réapparu avec Chrome 9.0.597.98.

Exemple de code HTML5

<progress id="progressBar" value="66.6" max="100"></progress>
<span id="percent"></span>
<script>
	eltBar = document.getElementById("progressBar");
	eltPct = document.getElementById("percent");
	eltPct.innerHTML = eltBar.position * 100 + "%";
</script>

<!-- Détection automatique -->
<script src="_html5detect.js"></script>
<script>isTagSupported("progress")</script>
Librairie JavaScript de détection automatique.

Démonstration du résultat HTML5