Elemento Progress en HTML5

Permite mostrar gráficamente el progreso de una tarea, como:

• La carga de un archivo
• La carga de una aplicación
• El avance de algún proceso

Solo posee dos parámetros, que son:

Max. El valor máximo

Value. El valor actual

Ejemplo:

<progress max="100" value="20"></progress>

Para ver realmente la funcionalidad de este elemento, podemos hacer uso de javascript, por ejemplo:

  <p>

        <progress max="100" value="0" id="barra"></progress>

    </p>

    <button onclick="setInterval('cargar()',1000)">Cargar</button>

    <script>

        function cargar(){

            var barra = document.getElementById("barra");

            barra.value += 5;

        }

    </script>

Puedes ver el ejemplo funcionando AQUI