Comment faire une barre de progression qui redémarre tous les x temps ?
Bonjour,
J'ai récupéré un code qui permet de faire un "Barre de progression" en javascript, cependant la barre se lance qu'une fois. Je souhaiterais qu'elle recommence 4x par exemple.
Voici le code :
Fichier HTML:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
| <html>
<head>
<title>barre de progression</title>
<script language="javascript" src="layerAccess.js"></script>
<script language="javascript" src="progressBar.js"></script>
</head>
<body onLoad="commencer()">
<script language="javascript"> <!--
initProgressBar(990);
var fini = true;
function augmenterRegulierement () {
if (getProgressBar() != 100) {
setProgressBar(getProgressBar()+1);
dispProgressBar();
setTimeout("augmenterRegulierement()", 10);
}
else {
fini = false;
}
}
function commencer()
{
if (fini) {
fini = false;
setProgressBar(0);
dispProgressBar();
augmenterRegulierement();
}
}
// --> </script>
</body>
</html> |
LayerAccess.js
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
| var isDHTML = 0;
var isLayers = 0;
var isAll = 0;
var isID = 0;
var isBusy = false;
if (document.getElementById) {
isID = 1; isDHTML = 1;
} else {
browserVersion = parseInt(navigator.appVersion);
if ((navigator.appName.indexOf('Netscape') != -1) && (browserVersion == 4)) {
isLayers = 1; isDHTML = 1;
} else {
if (document.all) {
isAll = 1; isDHTML = 1;
}
}
}
function findDOM(objectID,withStyle) {
if (withStyle == 1) {
if (isID) {
return (document.getElementById(objectID).style);
} else {
if (isAll) {
return (document.all[objectID].style);
} else {
return getObjNN4(top.document,objectID);
}
}
} else {
if (isID) {
return (document.getElementById(objectID));
} else {
if (isAll) {
return (document.all[objectID]);
} else {
if (isLayers) {
return getObjNN4(top.document,objectID);
}
}
}
}
}
function getObjNN4(obj,name)
{
var x = obj.layers;
for (var i=0;i<x.length;i++)
{
if (x[i].id == name)
return x[i];
else if (x[i].layers.length)
var tmp = getObjNN4(x[i],name);
if (tmp) return tmp;
}
return null;
}
function writeToLayer ( id, text )
{
// first we get a reference to the layer we want
// to modify
x = findDOM( id, 0 );
if ( !x )
return;
if ( isLayers ) {
// NS4 only allows you to have
// one output stream open at a time
// so if we are already writing to one
// we will try this again in 250 ms.
if ( isBusy ) {
setTimeout ( "writeToLayer( '" + id + "', '" + text + "' )", 20 );
} else {
isBusy = true;
// write does open for us
x.document.write(text);
x.document.close();
isBusy = false;
}
} else {
x.innerHTML = text;
}
} |
progressBar.js
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
| var progressBarValue;
var progressBarWidth;
var progressBarFG = '#cccccc';
var progressBarBG = '#3d3c3f';
var progressBarBorderColor = '#000000';
var progressBarBorderWidth = 0;
function initProgressBar(width)
{
setProgressBar(0);
progressBarWidth = width;
document.write('<div id="progressBar">here will be the progress bar</div>');
dispProgressBar();
return true;
}
function dispProgressBar()
{
var html = '';
var td1 = '';
var td2 = '';
var val = getProgressBar();
if (val == 0) {
td1 = '';
td2 = '<td width="100%" align="center"></td>';
}
else if (val == 100) {
td1 = '<td width="100%" bgColor="' + progressBarFG + '" align="center"></td>';
td2 = '';
}
else if (val > 50) {
td1 = '<td width="' + val + '%" bgColor="' + progressBarFG + '" align="center"></td>';
td2 = '<td width="' + (100-val) + '%"></td>';
}
else {
td1 = '<td width="' + val + '%" bgColor="' + progressBarFG + '"></td>';
td2 = '<td width="' + (100-val) + '%" align="center"></td>';
}
html = '<table border="' + progressBarBorderWidth + '" ';
html += 'width="' + progressBarWidth + '" ';
html += 'borderColor="' + progressBarBorderColor + '" ';
html += 'bgColor="' + progressBarBG + '" ';
html += 'cellpadding="5" cellspacing="0">';
html += '<tr>' + td1 + td2 + '</tr></table>';
writeToLayer('progressBar', html);
}
function setProgressBar(value)
{
if (value < 0) {
progressBarValue = 0;
}
else if (value > 100) {
progressBarValue = 100;
}
else {
progressBarValue = value;
}
return true;
}
function getProgressBar()
{
return progressBarValue;
} |
Y a-t-il une bonne âme qui puisse me dire où mettre une boucle for pour que le script redémarre automatiquement ?
Merci.
