corrade-http-templates – Blame information for rev 62

Subversion Repositories:
Rev:
Rev Author Line No. Line
62 office 1 <!doctype html>
2 <html lang="en">
3 <head>
4 <meta charset="utf-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1">
6 <title>jQuery UI Progressbar - Custom Label</title>
7 <link rel="stylesheet" href="../../themes/base/all.css">
8 <link rel="stylesheet" href="../demos.css">
9 <style>
10 .ui-progressbar {
11 position: relative;
12 }
13 .progress-label {
14 position: absolute;
15 left: 50%;
16 top: 4px;
17 font-weight: bold;
18 text-shadow: 1px 1px 0 #fff;
19 }
20 </style>
21 <script src="../../external/requirejs/require.js"></script>
22 <script src="../bootstrap.js">
23 var progressbar = $( "#progressbar" ),
24 progressLabel = $( ".progress-label" );
25  
26 progressbar.progressbar({
27 value: false,
28 change: function() {
29 progressLabel.text( progressbar.progressbar( "value" ) + "%" );
30 },
31 complete: function() {
32 progressLabel.text( "Complete!" );
33 }
34 });
35  
36 function progress() {
37 var val = progressbar.progressbar( "value" ) || 0;
38  
39 progressbar.progressbar( "value", val + 2 );
40  
41 if ( val < 99 ) {
42 setTimeout( progress, 80 );
43 }
44 }
45  
46 setTimeout( progress, 2000 );
47 </script>
48 </head>
49 <body>
50  
51 <div id="progressbar"><div class="progress-label">Loading...</div></div>
52  
53 <div class="demo-description">
54 <p>Custom updated label demo.</p>
55 </div>
56 </body>
57 </html>