 |
Publicité
|
Cette fonction vous permet d'afficher l'heure dans vos pages web.
<script language="JavaScript">
<!-- Début script
<!-- Préchargement des images -->
var nav=navigator.appName;
var Ver=parseInt(navigator.appVersion);
Vérification des navigateurs. Désolé, l'horloge ne peut pas fonctionner avec les versions moins récentes:
if (((nav == "Netscape") && (Ver >= 3)) || ((nav == "Microsoft Internet Explorer") && (Ver > 3))) {
Chiffre0 = new Image();
Chiffre1 = new Image();
Chiffre2 = new Image();
Chiffre3 = new Image();
Chiffre4 = new Image();
Chiffre5 = new Image();
Chiffre6 = new Image();
Chiffre7 = new Image();
Chiffre8 = new Image();
Chiffre9 = new Image();
Eteint = new Image();
DeuxPts = new Image();
Les images sont chargées avant de lancer l'horloge pour éviter les délais de chargement.
Ainsi l'affichage sera correct.
Chiffre0.src = "/img/article/Chiffre0.gif";
Chiffre1.src = "/img/article/Chiffre1.gif";
Chiffre2.src = "/img/article/Chiffre2.gif";
Chiffre3.src = "/img/article/Chiffre3.gif";
Chiffre4.src = "/img/article/Chiffre4.gif";
Chiffre5.src = "/img/article/Chiffre5.gif";
Chiffre6.src = "/img/article/Chiffre6.gif";
Chiffre7.src = "/img/article/Chiffre7.gif";
Chiffre8.src = "/img/article/Chiffre8.gif";
Chiffre9.src = "/img/article/Chiffre9.gif";
Images pour les points clignotants:
Eteint.src = "/img/article/Eteint.gif";
DeuxPts.src = "/img/article/DeuxPts.gif";
Ce tableau permet de faire correspondre le chiffre que l'on désire afficher et le nom de la ressource.
var ChifArray = new initArray("Chiffre0","Chiffre1", "Chiffre2", "Chiffre3", "Chiffre4", "Chiffre5", "Chiffre6", "Chiffre7", "Chiffre8", "Chiffre9");
Attention ici: ChifArray[1] correspondra à "Chiffre0" et non à "Chiffre1"
}
initArray() est appelée une seule fois pour définir ChifArray[]
function initArray() { // Thanks JavaScript Mailing List for this function
this.length = initArray.arguments.length
for (var i = 0; i < this.length; i++)
this[i+1] = initArray.arguments[i]
}
function initheure() {
maintenant = new Date();
Sec = maintenant.getSeconds();
Min = maintenant.getMinutes();
Heure = maintenant.getHours();
Décomposition du nombre de secondes en dizaines et unités de seconde pour récupérer les 2 chiffres nécessaires à l'affichage.
if (Sec>9){
DSec = parseInt(Sec/10);
USec = Sec - 10*DSec;
} else {
}
A priori le test n'est pas nécessaire mais à l'usage le résultat n'était pas concluant.
Idem pour les minutes
if (Min>9){
DMin = parseInt(Min/10);
UMin = Min - 10*DMin;
} else {
}
Idem pour les heures
if (Heure>9){
DHeure = parseInt(Heure/10);
UHeure = Heure - 10*DHeure;
} else {
DHeure = 0;
UHeure = Heure;
}
Pts = "Eteint";
Définition des images HTML dans l'ordre DH UH Pt1 DM UM Pt2 DS US
On peut noter ici que Java transformera les caractères apostrophes ' en guillemet " pour former le code HTML tandis que les guillemets sont utilisés pour concaténer les chaînes.
document.write("<IMG SRC='" + "/img/article/chiffre" + DHeure +".gif" + "' ALT='Heure' WIDTH=16 HEIGHT=21 BORDER=0 Name='DH'>");
document.write("<IMG SRC='" + "/img/article/chiffre" + UHeure +".gif" + "' ALT='Heure' WIDTH=16 HEIGHT=21 BORDER=0 Name='UH'>");
document.write("<IMG SRC='" + "/img/article/" + Pts +".gif" + "' ALT='Heure' WIDTH=7 HEIGHT=21 BORDER=0 Name='Pt1'>");
document.write("<IMG SRC='" + "/img/article/chiffre" + DMin +".gif" + "' ALT='Heure' WIDTH=16 HEIGHT=21 BORDER=0 Name='DM'>");
document.write("<IMG SRC='" + "/img/article/chiffre" + UMin +".gif" + "' ALT='Heure' WIDTH=16 HEIGHT=21 BORDER=0 Name='UM'>");
document.write("<IMG SRC='" + "/img/article/" + Pts +".gif" + "' ALT='Heure' WIDTH=7 HEIGHT=21 BORDER=0 Name='Pt2'>");
document.write("<IMG SRC='" + "/img/article/chiffre" + DSec +".gif" + "' ALT='Heure' WIDTH=16 HEIGHT=21 BORDER=0 Name='DS'>");
document.write("<IMG SRC='" + "/img/article/chiffre" + USec +".gif" + "' ALT='Heure' WIDTH=16 HEIGHT=21 BORDER=0 Name='US'>");
1er appel de la fonction qui va boucler sur elle-même.
}
function AffTemp(){
Tmps va servir à calculer le temps d'éxécution de la routine.
maintenant = new Date();
Tmps = maintenant.getTime();
if (Pts == "DeuxPts") {
} else {
}
<!-- Test du navigateur (type et version) -->
if (((nav == "Netscape") && (Ver >= 3)) || ((nav == "Microsoft Internet Explorer") && (Ver > 3))) {
<!-- Si ok affichage de l'heure -->
maintenant = new Date();
Sec = maintenant.getSeconds();
Min = maintenant.getMinutes();
Heure = maintenant.getHours();
if (Sec>9){
DSec = parseInt(Sec/10);
USec = Sec - 10*DSec;
} else {
}
if (Min>9){
DMin = parseInt(Min/10);
UMin = Min - 10*DMin;
} else {
}
if (Heure>9){
DHeure = parseInt(Heure/10);
UHeure = Heure - 10*DHeure;
} else {
DHeure = 0;
UHeure = Heure;
}
On Affecte ici à chaque image du document le nom de sa ressource.
Attention: la fonction eval() ici est nécessaire pour transformer les chaîne de caractères.
maintenant = new Date();
Tmps = maintenant.getTime() - Tmps;
C'est ici qu'apparait la redondance: AffTemp() appelle AffTemp().
pause = setTimeout("AffTemp()",(500-Tmps));
Gràce à Tmps, l'affichage tient compte du temps d'éxécution de la routine pour actualiser l'affichage toutes les 500 milli-secondes.
}
// Fin script -->
</script>
</HEAD>
Appel du script:
<script language="JavaScript">
<!-- Cache le script
//-->
</script>
Résultat :
|