Skip to content

Commit da240d9

Browse files
committed
Progressbar: Custom label demo cleanup
1 parent 9bd4430 commit da240d9

File tree

1 file changed

+22
-21
lines changed

1 file changed

+22
-21
lines changed

demos/progressbar/label.html

Lines changed: 22 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -2,43 +2,44 @@
22
<html lang="en">
33
<head>
44
<meta charset="utf-8">
5-
<title>jQuery UI Progressbar - Default functionality</title>
5+
<title>jQuery UI Progressbar - Custom Label</title>
66
<link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
77
<script src="../../jquery-1.8.3.js"></script>
88
<script src="../../ui/jquery.ui.core.js"></script>
99
<script src="../../ui/jquery.ui.widget.js"></script>
1010
<script src="../../ui/jquery.ui.progressbar.js"></script>
1111
<link rel="stylesheet" href="../demos.css">
1212
<style>
13-
.progress-label {
14-
float: left;
15-
margin-left: 50%;
16-
margin-top: 5px;
17-
font-weight: bold;
18-
}
13+
.progress-label {
14+
float: left;
15+
margin-left: 50%;
16+
margin-top: 5px;
17+
font-weight: bold;
18+
text-shadow: 1px 1px 0 #fff;
19+
}
1920
</style>
2021
<script>
2122
$(function() {
22-
$( "#progressbar" ).progressbar({
23+
var progressbar = $( "#progressbar" ),
24+
progressLabel = $( ".progress-label" );
25+
26+
progressbar.progressbar({
2327
value: false,
24-
change: function( event, ui ) {
25-
$( ".progress-label" ).text( $( "#progressbar" ).progressbar( "value" ) + "%" );
28+
change: function() {
29+
progressLabel.text( progressbar.progressbar( "value" ) + "%" );
30+
},
31+
complete: function() {
32+
progressLabel.text( "Complete!" );
2633
}
2734
});
2835

2936
function progress() {
30-
var val = $( "#progressbar" ).progressbar( "value" );
37+
var val = progressbar.progressbar( "value" ) || 0;
3138

32-
if ( !val ) {
33-
val = 0;
34-
}
35-
if ( val < 100 ) {
36-
$( "#progressbar" ).progressbar( "value", val + 1 );
37-
setTimeout( function() {
38-
progress();
39-
}, 100);
40-
} else {
41-
$( ".progress-label" ).text( "Complete!" );
39+
progressbar.progressbar( "value", val + 1 );
40+
41+
if ( val < 99 ) {
42+
setTimeout( progress, 100 );
4243
}
4344
}
4445

0 commit comments

Comments
 (0)