The progressbar () Method

The progressbar () method can be used in two forms:

  • $(selector, context).progressbar (options)

  • $(selector, context).progressbar ("action", params)

The progressbar (options) Method

The progressbar (options) method declares that an HTML element should be managed in the form of a progress bar. The options parameter is an object that specifies the appearance and behavior of the progress bar. The available options (described in Table 6-1) allow you to manage the progress bars or events taking place in the progress bar.

Table 6-1. Options for managing progress bars and events




Percentage of the progress bar to fill (from 0 to 100).


The change (event) method is called whenever the fill percentage of the progress bar changes (by changing the options.value option).

The progressbar (“action”, params) Method

The progressbar ("action", params) method can perform an action on the progress bar, such as changing the percentage filled. The action is specified as a string in the first argument (e.g., "value" to change the percentage filled). The options for this method are described in Table 6-2.

Table 6-2. The progressbar (“action”, params) method actions



progressbar ("value")

Retrieve the current value of options.value, that is, the percentage of fill in the progress bar.

progressbar ("value", value)

Specify a new value to the percentage filled in the progress bar.

progressbar ("option", param)

Retrieve the value of the param option ...

Get jQuery UI now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.