Simple Javascript Progress Bar with CSS es una biblioteca en Javascript para implementar con CSS barras de progreso en páginas web. Es una solución ideal para evitar en estos casos el uso de Flash.
Este recurso permite mostrar una barra de porcentaje usando solo 2 imágenes por medio de CSS y además con un poco de Javascript, hacer que sea más interactiva.
Requiere Prototype Framework y es distribuida con licencia Creative Commons.
Fuente: Pixelco









Una barra de 2Kb. aprox. con JavaScript y un DIV que contiene los SPAN con dos espacios en blanco cada uno (indicadores de progreso). Es una adaptación que hice unos meses atrás.
La parte del DIV y los SPAN.
La parte del Script.
var progressEnd = 25;
var progressColor = ‘#4A4A4A’;
var progressInterval = 80;
var progressAt = progressEnd;
var progressTimer;
function progress_clear() {
for (var i = 1; i progressEnd) progress_clear();
else document.getElementById(’progress’+progressAt).style.backgroundColor = progressColor;
progressTimer = setTimeout(’progress_update()’,progressInterval);
}
function progress_stop() {
clearTimeout(progressTimer);
progress_clear();
}
progress_update();
Algunos enlaces relacionados:
http://scriptasylum.com/backpage.html
http://scriptasylum.com/miscpage.html
Otros, por no discriminar mucho:
http://www.ribosomatic.com/articulos/barras-de-progreso-con-jquery-javascript-css-y-photoshop/
Personalmente utilizo barras que sean configurables, flexibles, rápidas; que justifiquen la altrnativa a una imagen. Por tanto, huyo de códigos sofisticados y de gran tamaño.
Otro quebradero de “cabeza” es la olvidada compatibilidad, y no me refiero a los nuevos navegadores.
Por otro lado:
Mootols, Prototype, Jquery, y otros desarrollos similares, están muy bien, pero el tamaño de sus Scripts, me refiero en general, no lo veo justificado. Después de más de diez años visitando millones de páginas (sin comillas), en busca de código perfecto, me quedo con un centenar – y son muchas – que he ido encontrando, en ocasiones, por casualidad. Tengo que revisar los enlaces, y retomar el tema para “regocijo”, si es que no las han convertido a – FLASH (películas para espectadores pasivos) – donde se participa poco, nada quizás?. En fin, volvamos a lo que hacemos y/o disfrutamos; y, dejemos un rato, las máquinas de generar código, que, segúramente, aportan poco a la autonomía individual.