Colocar ancho a un progressbar de jqueryui

Para mostrar un ancho definido a un progress bar podríamos tener lo siguiente:

HTML

<div id="progressbar">
</div>

JAVASCRIPT
Inicialización:

$("#progressbar").progressbar({
                    value: 0
                });
$("#progressbar").children().html('<div class="ui-progressbar-overlay"></div>'); //animacion de barra de progreso según valor

Modificar tamaño y color de progressbar por javascript

var progressbar = $("#progressbar"),
                progressbarValue = progressbar.find(".ui-progressbar-value");

            if (progressbar.children().length > 0) {
                //seteando valor
                progressbar.progressbar("option", { value: 50 });
                //seteando color
                progressbarValue.css({ "background": '#' + color });
            }


Sean felices! :) Y siéntanse libres de opinar ;)

No hay comentarios:

Publicar un comentario