HTML and CSS Reference
Figure 8-1. Example of progress indicators
The progress element has two simple attributes. Omitting the attributes will create an indeterminate progress bar.
By using the two attributes you can specify the max value of the progress bar and the current value (i.e., position) of
the progress bar. Details about the attributes can be seen in Table 8-3 .
Table 8-3. List of Attributes for the Progress Element
Describes the maximum number of the progress bar indicating that
the task has completed.
Describes how much of the task has been completed.
The progress element is fairly simple and can quickly be transformed into a JSF component. To make the
component useful we will add an additional “for” attribute that can be pointed at another component such as the
video or audio component. The progress bar will automatically update its progress based on the playback of the video
or audio component.
matter how many times the component is used on a single page.
Listing 8-14. The Composite Progress Component resources/projsfhtml5/progress.xhtml
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns=" http://www.w3.org/1999/xhtml "
xmlns:cc=" http://xmlns.jcp.org/jsf/composite "
xmlns:jsf=" http://xmlns.jcp.org/jsf "
xmlns:c=" http://xmlns.jcp.org/jsp/jstl/core "
xmlns:f=" http://xmlns.jcp.org/jsf/core "
xmlns:h=" http://xmlns.jcp.org/jsf/html " >
<cc:attribute name="value" type="java.lang.String"
shortDescription="How much of the task has been completed" />
Search WWH ::