Horloge binaire avec image

Soyez le premier à donner votre avis sur cette source.

Vue 23 877 fois - Téléchargée 1 416 fois

Description

Voilà une autre version de l'horloge binaire en image cette fois-ci !

Créer 2 fichiers image nommés img0.gif et img1.gif de même taille et placer les dans le même dossier que le fichier "Horloge Binaire img.htm" et "Horloge Binaire img.js"
A moins de prendre le zip où vous trouverez les images.
Vous pouvez modifier la couleur de fond et le style des bordure dans l'entête du fichier htm.

Source / Exemple :


Titre du fichier : Horloge Binaire img.htm

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Horloge binaire en JavaScript</title>
<script type="text/javascript" src="Horloge Binaire img.js">
</script>
<style type="text/css">
body {background-color:#000000;}
h1 {color:#ffffff; font-family:Verdana;}
table {border:#49c7ce groove 10px;}
img {border:#ffff00 outset 2px;}
</style>
</head>
<body onload="showtime();">
<H1>Horloge Binaire</H1>

<table>
<tr>
 <td valign="bottom">
 <img src="img0.gif" name="dheure1" alt="" /><br />
 <img src="img0.gif" name="dheure0" alt="" /><br />
 </td>
 <td>
 <img src="img0.gif" name="uheure3" alt="" /><br />
 <img src="img0.gif" name="uheure2" alt="" /><br />
 <img src="img0.gif" name="uheure1" alt="" /><br />
 <img src="img0.gif" name="uheure0" alt="" /><br />
 </td>

<td>&nbsp;&nbsp;&nbsp;</td>

 <td valign="bottom">
 <img src="img0.gif" name="dmin2" alt="" /><br />
 <img src="img0.gif" name="dmin1" alt="" /><br />
 <img src="img0.gif" name="dmin0" alt="" /><br />
 </td>
 <td>
 <img src="img0.gif" name="umin3" alt="" /><br />
 <img src="img0.gif" name="umin2" alt="" /><br />
 <img src="img0.gif" name="umin1" alt="" /><br />
 <img src="img0.gif" name="umin0" alt="" /><br />
 </td>

<td>&nbsp;&nbsp;&nbsp;</td>

 <td valign="bottom">
 <img src="img0.gif" name="dsec2" alt="" /><br />
 <img src="img0.gif" name="dsec1" alt="" /><br />
 <img src="img0.gif" name="dsec0" alt="" /><br />
 </td>
 <td>
 <img src="img0.gif" name="usec3" alt="" /><br />
 <img src="img0.gif" name="usec2" alt="" /><br />
 <img src="img0.gif" name="usec1" alt="" /><br />
 <img src="img0.gif" name="usec0" alt="" /><br />
 </td>
</tr>

</table>
</body>
</html>

--------------------------------------------
Titre du fichier :  Horloge Binaire img.js

/* Horloge Binaire avec image par Jean ELCHINGER optimisé par TheGuit
Date : 16/12/2003
Email : web.jean@ifrance.com

Script modifié à partir de l'horloge binaire :
http://www.california.com/~binard

Pour acheter une vraie horloge binaire :
LED Binary Clock
http://www.thinkgeek.com/cubegoodies/lights/59e0/

  • /
var timerID = null; img0=new Image(); img0.src="img0.gif" img1=new Image(); img1.src="img1.gif" function showtime() { var now = new Date(); var decimal_hours = now.getHours(); var decimal_minutes = now.getMinutes(); var decimal_seconds = now.getSeconds(); var sec=decimal_seconds; // seconde if(sec>=40) { document.images.dsec2.src = eval("img1.src") sec-=40; } else { document.images.dsec2.src = eval("img0.src") } if(sec>=20) { document.images.dsec1.src = eval("img1.src") sec-=20; } else { document.images.dsec1.src = eval("img0.src") } if(sec>=10) { document.images.dsec0.src = eval("img1.src") sec-=10; } else { document.images.dsec0.src = eval("img0.src") } if(sec>=8) { document.images.usec3.src = eval("img1.src") sec-=8; } else { document.images.usec3.src = eval("img0.src") } if(sec>=4) { document.images.usec2.src = eval("img1.src") sec-=4; } else { document.images.usec2.src = eval("img0.src") } if(sec>=2) { document.images.usec1.src = eval("img1.src") sec-=2; } else { document.images.usec1.src = eval("img0.src") } if(sec>=1) { document.images.usec0.src = eval("img1.src") sec-=1; } else { document.images.usec0.src = eval("img0.src") } var min=decimal_minutes; // minute if(min>=40) { document.images.dmin2.src = eval("img1.src") min-=40; } else { document.images.dmin2.src = eval("img0.src") } if(min>=20) { document.images.dmin1.src = eval("img1.src") min-=20; } else { document.images.dmin1.src = eval("img0.src") } if(min>=10) { document.images.dmin0.src = eval("img1.src") min-=10; } else { document.images.dmin0.src = eval("img0.src") } if(min>=8) { document.images.umin3.src = eval("img1.src") min-=8; } else { document.images.umin3.src = eval("img0.src") } if(min>=4) { document.images.umin2.src = eval("img1.src") min-=4; } else { document.images.umin2.src = eval("img0.src") } if(min>=2) { document.images.umin1.src = eval("img1.src") min-=2; } else { document.images.umin1.src = eval("img0.src") } if(min>=1) { document.images.umin0.src = eval("img1.src") min-=1; } else { document.images.umin0.src = eval("img0.src") } var heure=decimal_hours; // heure if(heure>=20) { document.images.dheure1.src = eval("img1.src") heure-=20; } else { document.images.dheure1.src = eval("img0.src") } if(heure>=10) { document.images.dheure0.src = eval("img1.src") heure-=10; } else { document.images.dheure0.src = eval("img0.src") } if(heure>=8) { document.images.uheure3.src = eval("img1.src") heure-=8; } else { document.images.uheure3.src = eval("img0.src") } if(heure>=4) { document.images.uheure2.src = eval("img1.src") heure-=4; } else { document.images.uheure2.src = eval("img0.src") } if(heure>=2) { document.images.uheure1.src = eval("img1.src") heure-=2; } else { document.images.uheure1.src = eval("img0.src") } if(heure>=1) { document.images.uheure0.src = eval("img1.src") heure-=1; } else { document.images.uheure0.src = eval("img0.src") } timerID = setTimeout("showtime();",1000); }

Codes Sources

A voir également

Ajouter un commentaire

Commentaire

cs_DomJ
Messages postés
140
Date d'inscription
dimanche 4 décembre 2005
Statut
Membre
Dernière intervention
3 décembre 2013
1 -
Sérieusement, bravo pour ta source!

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.