XUL:progressmeter

From MDC

« XUL Reference home [ Examples | Attributes | Properties | Methods | Related ]

A meter which can be used to display the progress of a lengthy operation. It is drawn as a bar that is filled as the operation completes. In addition, an indeterminate progressmeter may be created by setting the mode attribute to undetermined. This is used when the length of time to complete an operation is not known beforehand.

More information is available in the XUL tutorial.

Attributes: mode, value

Properties: accessibleType, mode, value

[edit] Examples

<progressmeter mode="determined" value="82"/>
<progressmeter mode="undetermined"/>

<!-- switching modes while the mouse is over a button -->
<progressmeter mode="determined" id="myProgress"/>
<button label="Example" onmouseover="setLoading(true)"
                        onmouseout="setLoading(false)"/>
function setLoading(state){
  document.getElementById('myProgress').mode =
           (state) ? 'undetermined' : 'determined';
}

[edit] Attributes

mode: Type: one of the values below; A determined progressmeter is used in cases where you know how long an operation will take. An undetermined progressmeter can be used when you don't and will typically be drawn as a spinning barber pole.

determined: The progress meter uses its value attribute to determine the amount of the bar that is filled in.
undetermined: The progressmeter is indeterminate.

value: Type: integer; An integer ranging from 0 to 100 that indicates the progress. For instance, setting the value to "0" shows an empty bar, "100" shows a bar at full length and "25" shows the first quarter of the bar. Characters after the number are ignored.

Inherited from XUL element
align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortDirection, sortResource, sortResource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width