Chronomètre dynamique

Télécharger le projet
Commenter

Description

Voici un chronomètre dynamique, avec un bouton start, pause et RAZ.
Le chrono peut vous compter normalement ( jour(s), heure(s), minute(s) et seconde(s)). Elle affiche le temps dans votre barre de status et dans un champ de texte.

Source / Exemple : 


<html>
<head>
<title>Chronomètre</title>
</head>
<body bgcolor="#00CCFF">
<div align="center"><h4>Chronomètre</h4>
<script language='JavaScript'>
ss=0;
s=00;
m='0'+0;
h='0'+0;
j=0;
window.status = "Chrono "+j+" jour(s) et " +h + ' : '  + m + ' : ' + s ; 
function Chrono() {
if (m==0) {m='00'}
if(h==0) {h='00'}
if (ss<10){ss='0'+ss;}
if (s<10){s='0'+s;}
 window.status = "Chrono "+j+" jour(s) et " +h + ' : '  + m + ' : ' + s ; 
document.formu.heure.value =j+" jour(s) et "+h + ' : ' + m + ' : ' + s ;
document.formu.seco.value =ss;
s++;
ss++;
if (h==24){h='0'+0;j++;}
if (s==60){s=0;s=0; m++;if(m<10){m='0'+m;}}
if (m==60){m='0'+0;h++;if(h<10){h='0'+h;}}
chrono=window.setTimeout("Chrono();",1000);
}
</script>
</div>
<form action="" method="post" name="formu" id="formu">
  <p align="center"> 
    <input name="heure" type="text" id="heure" value="0 jour(s) et 00 : 00 : 00"> ou    <input name="seco" type="text"  value="00"> seconde(s).
  </p>
  <p align="center"> 
    <input type="button" name="Submit" value="Start!" onClick="Chrono();">
    <input type="button" name="Submit2" value="Stop!" onClick="window.clearTimeout(chrono);">
    <input type="button" name="Submit3" value="RAZ"onClick="if (confirm('Souhaitez vous mettre le compteur à zéro?')){s=0;m=0;j=0;h=0;ss=0; window.status = 'Chrono 0 jour(s) et 00 : 00 : 00' ; document.formu.heure.value ='0 jour(s) et 00 : 00 : 00';document.formu.seco.value='0'+0;}">
  </p>
  <p align="center"><br>
    La Valeur du chrono apparaît dans la zone de texte et dans la barre de navigation 
    en bas de votre fenêtre. <br>
    Cliquez sur le bouton Start pour faire partir le chrono, le bouton stop pour 
    l'arrêter et le bouton RAZ pour remettre à zéro</p>
  <p align="center">. 
    
  </p>
</form>
</body>
</html>
Télécharger le projet

Codes Sources

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (Xo Sonic oX)