| Warning |
|---|
This page has not yet been updated to reflect the latest API changes. |
| Section |
|---|
| Column |
|---|
| Progress OverviewThe Infusion Progress component provides a usable and accessible linear progress display for use on its own or with other Infusion components. It was originally designed for the Infusion Uploader but was built to be highly flexible -- customizable for use in any context. It has a very simple API but achieves its flexibility through a number of configuration options which at first may not seem intuitive. Progress does not currently come with a default presentation. We hope that through our design examples you can come up with your own designs that integrate well with your application or component. Infusion Progress is currently used in the Uploader and in the Fluid Project wiki to provide component progress indicators. The Progress component provides the option to the integrator to switch between aria-valuenow and aria-valuetext. See the Options description below for more information. |
| Column |
|---|
| Panel |
|---|
| borderColor | #321137 |
|---|
| bgColor | #fff |
|---|
| titleBGColor | #aab597 |
|---|
| borderStyle | solid |
|---|
| title | Status | borderStyle | solid |
|---|
| This component is in Preview status |
| Panel |
|---|
| borderColor | #566b30 |
|---|
| bgColor | #fff |
|---|
| titleBGColor | #D3E3C4 |
|---|
| borderStyle | solid |
|---|
| title | On This Page | borderStyle | solid |
|---|
| |
| Panel |
|---|
| borderColor | #321137 |
|---|
| bgColor | #fff |
|---|
| titleBGColor | #c1b7c3 |
|---|
| borderStyle | solid |
|---|
| title | See Also | borderStyle | solid |
|---|
| |
| Panel |
|---|
| borderColor | #321137 |
|---|
| bgColor | #fff |
|---|
| titleBGColor | #cccccc |
|---|
| borderStyle | solid |
|---|
| title | Still need help? | borderStyle | solid |
|---|
| Join the infusion-users mailing list and ask your questions there. |
|
|
...
Returns: The Progress component object.
Note: the initial state of a progress element is assumed to be hidden with the minimum amount of progress.
...
minWidth
| Integer which specifies the minimum width for the progress indicator element | pixels | |
delay
| delay before hiding the progress after the Progress.hide() method.
a delay allows the user to register the completion of progress before hiding the progress bar. | millies (milliseconds) | |
speed
| Integer representing the speed for the Progress animations.
The default is very fast because you want the animation to keep up with the actual speed of the action. | | |
animate
| String indicating which directions of progress get animated.
In most cases you only want to animate forward. | "forward", "backward", and "both". Any other value is interpreted to mean don't animate at all | | Code Block |
|---|
| animate: "forward"
|
|
initallyHiddeninitiallyHidden
| Boolean indicating whether to hide the displayElement when initializing Progress. | boolean | | Code Block |
|---|
| initiallyHidden: true
|
|
updatePosition | | boolean | | Code Block |
|---|
| updatePosition: false
|
|
...
Selectors
Selectors are used to indicate which elements in DOM should behave as the different Progress elements.
The value for the option is itself a Javascript object containing name/value pairs:
...