Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

UNE HORLOGE QUI TOURNE


Information sur la source

Catégorie :Date & Heure Classé sous : horloge, tourne Niveau : Débutant Date de création : 23/05/2003 Date de mise à jour : 23/05/2003 14:11:10 Vu : 10 975

Note :
10 / 10 - par 1 personne
10,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10

Commentaire sur cette source (1)
Ajouter un commentaire et/ou une note

Description

Tout est dans le titre, une horloge qui se met à jour automatiquement et paramétrable. Cette source n'est pas de moi mais je la trouve sympa donc je vous la soumets...
 

Source

  • <HTML>
  • <HEAD>
  • <META content="text/html; charset=windows-1252" http-equiv=Content-Type>
  • <META content="MSHTML 5.00.3105.105" name=GENERATOR></HEAD>
  • <BODY>
  • <SCRIPT language=JavaScript>
  • dCol='000000';//date colour.
  • fCol='000000';//face colour.
  • sCol='000000';//seconds colour.
  • mCol='000000';//minutes colour.
  • hCol='000000';//hours colour.
  • ClockHeight=40;
  • ClockWidth=40;
  • ClockFromMouseY=0;
  • ClockFromMouseX=100;
  • d=new Array("DIMANCHE","LUNDI","MARDI","MERCREDI","JEUDI","VENDREDI","SAMEDI");
  • m=new Array("JANVIER","FEVRIER","MARS","AVRIL","MAI","JUIN","JUILLET","AOUT","SEPTEMBRE","OCTOBRE","NOVEMBRE","DECEMBRE");
  • date=new Date();
  • day=date.getDate();
  • year=date.getYear();
  • if (year < 2000) year=year+1900;
  • TodaysDate=" "+d[date.getDay()]+" "+day+" "+m[date.getMonth()]+" "+year;
  • D=TodaysDate.split('');
  • H='...';
  • H=H.split('');
  • M='....';
  • M=M.split('');
  • S='.....';
  • S=S.split('');
  • Face='1 2 3 4 5 6 7 8 9 10 11 12';
  • font='Arial';
  • size=1;
  • speed=0.6;
  • ns=(document.layers);
  • ie=(document.all);
  • Face=Face.split(' ');
  • n=Face.length;
  • a=size*10;
  • ymouse=0;
  • xmouse=0;
  • scrll=0;
  • props="<font face="+font+" size="+size+" color="+fCol+"><B>";
  • props2="<font face="+font+" size="+size+" color="+dCol+"><B>";
  • Split=360/n;
  • Dsplit=360/D.length;
  • HandHeight=ClockHeight/4.5
  • HandWidth=ClockWidth/4.5
  • HandY=-7;
  • HandX=-2.5;
  • scrll=0;
  • step=0.06;
  • currStep=0;
  • y=new Array();x=new Array();Y=new Array();X=new Array();
  • for (i=0; i < n; i++){y[i]=0;x[i]=0;Y[i]=0;X[i]=0}
  • Dy=new Array();Dx=new Array();DY=new Array();DX=new Array();
  • for (i=0; i < D.length; i++){Dy[i]=0;Dx[i]=0;DY[i]=0;DX[i]=0}
  • if (ns){
  • for (i=0; i < D.length; i++)
  • document.write('<layer name="nsDate'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props2+D[i]+'</font></center></layer>');
  • for (i=0; i < n; i++)
  • document.write('<layer name="nsFace'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+Face[i]+'</font></center></layer>');
  • for (i=0; i < S.length; i++)
  • document.write('<layer name=nsSeconds'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</b></center></font></layer>');
  • for (i=0; i < M.length; i++)
  • document.write('<layer name=nsMinutes'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+mCol+'><center><b>'+M[i]+'</b></center></font></layer>');
  • for (i=0; i < H.length; i++)
  • document.write('<layer name=nsHours'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+hCol+'><center><b>'+H[i]+'</b></center></font></layer>');
  • }
  • if (ie){
  • document.write('<div id="Od" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
  • for (i=0; i < D.length; i++)
  • document.write('<div id="ieDate" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props2+D[i]+'</B></font></div>');
  • document.write('</div></div>');
  • document.write('<div id="Of" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
  • for (i=0; i < n; i++)
  • document.write('<div id="ieFace" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props+Face[i]+'</B></font></div>');
  • document.write('</div></div>');
  • document.write('<div id="Oh" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
  • for (i=0; i < H.length; i++)
  • document.write('<div id="ieHours" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+hCol+';text-align:center;font-weight:bold">'+H[i]+'</div>');
  • document.write('</div></div>');
  • document.write('<div id="Om" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
  • for (i=0; i < M.length; i++)
  • document.write('<div id="ieMinutes" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+mCol+';text-align:center;font-weight:bold">'+M[i]+'</div>');
  • document.write('</div></div>')
  • document.write('<div id="Os" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
  • for (i=0; i < S.length; i++)
  • document.write('<div id="ieSeconds" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+sCol+';text-align:center;font-weight:bold">'+S[i]+'</div>');
  • document.write('</div></div>')
  • }
  • (ns)?window.captureEvents(Event.MOUSEMOVE):0;
  • function Mouse(evnt){
  • ymouse = (ns)?evnt.pageY+ClockFromMouseY-(window.pageYOffset):event.y+ClockFromMouseY;
  • xmouse = (ns)?evnt.pageX+ClockFromMouseX:event.x+ClockFromMouseX;
  • }
  • (ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
  • function ClockAndAssign(){
  • time = new Date ();
  • secs = time.getSeconds();
  • sec = -1.57 + Math.PI * secs/30;
  • mins = time.getMinutes();
  • min = -1.57 + Math.PI * mins/30;
  • hr = time.getHours();
  • hrs = -1.575 + Math.PI * hr/6+Math.PI*parseInt(time.getMinutes())/360;
  • if (ie){
  • Od.style.top=window.document.body.scrollTop;
  • Of.style.top=window.document.body.scrollTop;
  • Oh.style.top=window.document.body.scrollTop;
  • Om.style.top=window.document.body.scrollTop;
  • Os.style.top=window.document.body.scrollTop;
  • }
  • for (i=0; i < n; i++){
  • var F=(ns)?document.layers['nsFace'+i]:ieFace[i].style;
  • F.top=y[i] + ClockHeight*Math.sin(-1.0471 + i*Split*Math.PI/180)+scrll;
  • F.left=x[i] + ClockWidth*Math.cos(-1.0471 + i*Split*Math.PI/180);
  • }
  • for (i=0; i < H.length; i++){
  • var HL=(ns)?document.layers['nsHours'+i]:ieHours[i].style;
  • HL.top=y[i]+HandY+(i*HandHeight)*Math.sin(hrs)+scrll;
  • HL.left=x[i]+HandX+(i*HandWidth)*Math.cos(hrs);
  • }
  • for (i=0; i < M.length; i++){
  • var ML=(ns)?document.layers['nsMinutes'+i]:ieMinutes[i].style;
  • ML.top=y[i]+HandY+(i*HandHeight)*Math.sin(min)+scrll;
  • ML.left=x[i]+HandX+(i*HandWidth)*Math.cos(min);
  • }
  • for (i=0; i < S.length; i++){
  • var SL=(ns)?document.layers['nsSeconds'+i]:ieSeconds[i].style;
  • SL.top=y[i]+HandY+(i*HandHeight)*Math.sin(sec)+scrll;
  • SL.left=x[i]+HandX+(i*HandWidth)*Math.cos(sec);
  • }
  • for (i=0; i < D.length; i++){
  • var DL=(ns)?document.layers['nsDate'+i]:ieDate[i].style;
  • DL.top=Dy[i] + ClockHeight*1.5*Math.sin(currStep+i*Dsplit*Math.PI/180)+scrll;
  • DL.left=Dx[i] + ClockWidth*1.5*Math.cos(currStep+i*Dsplit*Math.PI/180);
  • }
  • currStep-=step;
  • }
  • function Delay(){
  • scrll=(ns)?window.pageYOffset:0;
  • Dy[0]=Math.round(DY[0]+=((ymouse)-DY[0])*speed);
  • Dx[0]=Math.round(DX[0]+=((xmouse)-DX[0])*speed);
  • for (i=1; i < D.length; i++){
  • Dy[i]=Math.round(DY[i]+=(Dy[i-1]-DY[i])*speed);
  • Dx[i]=Math.round(DX[i]+=(Dx[i-1]-DX[i])*speed);
  • }
  • y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
  • x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
  • for (i=1; i < n; i++){
  • y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);
  • x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);
  • }
  • ClockAndAssign();
  • setTimeout('Delay()',20);
  • }
  • if (ns||ie)window.onload=Delay;
  • </SCRIPT>
  • <p>Attention l'heure tourne!</p>
  • </BODY>
  • </HTML>
<HTML>
<HEAD>
<META content="text/html; charset=windows-1252" http-equiv=Content-Type>
<META content="MSHTML 5.00.3105.105" name=GENERATOR></HEAD>
<BODY>

<SCRIPT language=JavaScript>
dCol='000000';//date colour.
fCol='000000';//face colour.
sCol='000000';//seconds colour.
mCol='000000';//minutes colour.
hCol='000000';//hours colour.
ClockHeight=40;
ClockWidth=40;
ClockFromMouseY=0;
ClockFromMouseX=100;

d=new Array("DIMANCHE","LUNDI","MARDI","MERCREDI","JEUDI","VENDREDI","SAMEDI");
m=new Array("JANVIER","FEVRIER","MARS","AVRIL","MAI","JUIN","JUILLET","AOUT","SEPTEMBRE","OCTOBRE","NOVEMBRE","DECEMBRE");
date=new Date();
day=date.getDate();
year=date.getYear();
if (year < 2000) year=year+1900;
TodaysDate=" "+d[date.getDay()]+" "+day+" "+m[date.getMonth()]+" "+year;
D=TodaysDate.split('');
H='...';
H=H.split('');
M='....';
M=M.split('');
S='.....';
S=S.split('');
Face='1 2 3 4 5 6 7 8 9 10 11 12';
font='Arial';
size=1;
speed=0.6;
ns=(document.layers);
ie=(document.all);
Face=Face.split(' ');
n=Face.length;
a=size*10;
ymouse=0;
xmouse=0;
scrll=0;
props="<font face="+font+" size="+size+" color="+fCol+"><B>";
props2="<font face="+font+" size="+size+" color="+dCol+"><B>";
Split=360/n;
Dsplit=360/D.length;
HandHeight=ClockHeight/4.5
HandWidth=ClockWidth/4.5
HandY=-7;
HandX=-2.5;
scrll=0;
step=0.06;
currStep=0;
y=new Array();x=new Array();Y=new Array();X=new Array();
for (i=0; i < n; i++){y[i]=0;x[i]=0;Y[i]=0;X[i]=0}
Dy=new Array();Dx=new Array();DY=new Array();DX=new Array();
for (i=0; i < D.length; i++){Dy[i]=0;Dx[i]=0;DY[i]=0;DX[i]=0}
if (ns){
for (i=0; i < D.length; i++)
document.write('<layer name="nsDate'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props2+D[i]+'</font></center></layer>');
for (i=0; i < n; i++)
document.write('<layer name="nsFace'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+Face[i]+'</font></center></layer>');
for (i=0; i < S.length; i++)
document.write('<layer name=nsSeconds'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</b></center></font></layer>');
for (i=0; i < M.length; i++)
document.write('<layer name=nsMinutes'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+mCol+'><center><b>'+M[i]+'</b></center></font></layer>');
for (i=0; i < H.length; i++)
document.write('<layer name=nsHours'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+hCol+'><center><b>'+H[i]+'</b></center></font></layer>');
}
if (ie){
document.write('<div id="Od" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < D.length; i++)
document.write('<div id="ieDate" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props2+D[i]+'</B></font></div>');
document.write('</div></div>');
document.write('<div id="Of" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < n; i++)
document.write('<div id="ieFace" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props+Face[i]+'</B></font></div>');
document.write('</div></div>');
document.write('<div id="Oh" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < H.length; i++)
document.write('<div id="ieHours" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+hCol+';text-align:center;font-weight:bold">'+H[i]+'</div>');
document.write('</div></div>');
document.write('<div id="Om" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < M.length; i++)
document.write('<div id="ieMinutes" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+mCol+';text-align:center;font-weight:bold">'+M[i]+'</div>');
document.write('</div></div>')
document.write('<div id="Os" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < S.length; i++)
document.write('<div id="ieSeconds" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+sCol+';text-align:center;font-weight:bold">'+S[i]+'</div>');
document.write('</div></div>')
}
(ns)?window.captureEvents(Event.MOUSEMOVE):0;
function Mouse(evnt){
ymouse = (ns)?evnt.pageY+ClockFromMouseY-(window.pageYOffset):event.y+ClockFromMouseY;
xmouse = (ns)?evnt.pageX+ClockFromMouseX:event.x+ClockFromMouseX;
}
(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
function ClockAndAssign(){
time = new Date ();
secs = time.getSeconds();
sec = -1.57 + Math.PI * secs/30;
mins = time.getMinutes();
min = -1.57 + Math.PI * mins/30;
hr = time.getHours();
hrs = -1.575 + Math.PI * hr/6+Math.PI*parseInt(time.getMinutes())/360;
if (ie){
Od.style.top=window.document.body.scrollTop;
Of.style.top=window.document.body.scrollTop;
Oh.style.top=window.document.body.scrollTop;
Om.style.top=window.document.body.scrollTop;
Os.style.top=window.document.body.scrollTop;
}
for (i=0; i < n; i++){
 var F=(ns)?document.layers['nsFace'+i]:ieFace[i].style;
 F.top=y[i] + ClockHeight*Math.sin(-1.0471 + i*Split*Math.PI/180)+scrll;
 F.left=x[i] + ClockWidth*Math.cos(-1.0471 + i*Split*Math.PI/180);
 }
for (i=0; i < H.length; i++){
 var HL=(ns)?document.layers['nsHours'+i]:ieHours[i].style;
 HL.top=y[i]+HandY+(i*HandHeight)*Math.sin(hrs)+scrll;
 HL.left=x[i]+HandX+(i*HandWidth)*Math.cos(hrs);
 }
for (i=0; i < M.length; i++){
 var ML=(ns)?document.layers['nsMinutes'+i]:ieMinutes[i].style;
 ML.top=y[i]+HandY+(i*HandHeight)*Math.sin(min)+scrll;
 ML.left=x[i]+HandX+(i*HandWidth)*Math.cos(min);
 }
for (i=0; i < S.length; i++){
 var SL=(ns)?document.layers['nsSeconds'+i]:ieSeconds[i].style;
 SL.top=y[i]+HandY+(i*HandHeight)*Math.sin(sec)+scrll;
 SL.left=x[i]+HandX+(i*HandWidth)*Math.cos(sec);
 }
for (i=0; i < D.length; i++){
 var DL=(ns)?document.layers['nsDate'+i]:ieDate[i].style;
 DL.top=Dy[i] + ClockHeight*1.5*Math.sin(currStep+i*Dsplit*Math.PI/180)+scrll;
 DL.left=Dx[i] + ClockWidth*1.5*Math.cos(currStep+i*Dsplit*Math.PI/180);
 }
currStep-=step;
}
function Delay(){
scrll=(ns)?window.pageYOffset:0;
Dy[0]=Math.round(DY[0]+=((ymouse)-DY[0])*speed);
Dx[0]=Math.round(DX[0]+=((xmouse)-DX[0])*speed);
for (i=1; i < D.length; i++){
Dy[i]=Math.round(DY[i]+=(Dy[i-1]-DY[i])*speed);
Dx[i]=Math.round(DX[i]+=(Dx[i-1]-DX[i])*speed);
}
y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
for (i=1; i < n; i++){
y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);
x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);
}
ClockAndAssign();
setTimeout('Delay()',20);
}
if (ns||ie)window.onload=Delay;
</SCRIPT>
<p>Attention l'heure tourne!</p>
</BODY>
</HTML>

Commentaires et avis

signaler à un administrateur
Commentaire de bob3000 le 23/05/2003 14:32:21

cest bon
mais ca fait un peu chier qu'a chaque fois que tu bouche la souris, ya l'horloge qui bouge...

Ajouter un commentaire

Discussions en rapport avec ce code source dans le forum

HORLOGE À AIGUILLES QUI TOURNENT AVEC LA DATE [ par profnaimbus ] Bonjour,j'ai un problème avec le script HORLOGE À AIGUILLES QUI TOURNENT AVEC LA DATE, je n'arrive pas à le faire fonctionner pouvez vous m'aider??? horloge/calendrier [ par nlola28 ] kikou...je suis a la recherche du script pour faire des petite horloges avec des imges sur laquelle apparait la date et lheure atuel...mercinadine Simuler de thread en Javascript [ par petit_stagiaire ] Bonjour,j'ai créé une fonction qui permet de faire tourner une image.elle se rappelle elle-même avec in setTimeout qui simule la vitesse.function tour probleme d'affichage du script horloge/date pour la souris [ par aragorn13000 ] bonsoirm'étant enfin decidé à faire un site web je voulais mettre un script pour le curseur qui affiche l'heure et la date qui se deplace avec lui,mon texte qui tourne [ par feezooz ] bonjour,je cherche à pouvoir faire du texte qui tourne en rond. pas autour du curseur, pas avec des effets speciaux, etc.juste voir une phrase qui tou horloge... facile mais ca marche pas... [ par darkthief ] Salut a tous !j'ai écrit ce code mais il ne marche pas...Pourriez vous m'aidez svp :D ?&lt;html&gt;&lt;head&gt; &lt;title&gt;horloge&lt;/title&gt; &lt case a cocher + php [ par jimmy69 ] Bonjour a tous, J'ai un p'tit souci au point de vue des cases cocher ! je vous explique j'ai un listing de contacts (nom, prenom etc...) que je liste créer un calendrier et une horloge [ par plumetine ] J'aimerai savoir comment peut-on cr&#233;er un calendrier et une horloge avec imageet animation.Dans l'attente d'une r&#233;ponse,je vous souhaite une pour que le lecteur tourne en loop [ par termi62 ] je recherche code &#224; ajouter pour le lecteur mp3&nbsp;source id=20533 mes songs en boucle installation d'une horloge (aide) [ par le blogueur ] recherche personne pouvant m'aider et m'expliquer comment mettre une horloge qui suit le curseur sur un blog msn.je sais passer en mode EDIT IT ! mais


Nos sponsors

Sondage...

CalendriCode

Novembre 2008
LMMJVSD
     12
3456789
10111213141516
17181920212223
24252627282930

Consulter la suite du CalendriCode

Appels d'offres

Téléchargements

Logiciels à télécharger sur le même thème :



Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel BAÏSE, Merci à Vincent pour ses précieux conseils
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés
Temps d'éxécution de la page : 0,343 sec

Google Coop CodeS-SourceS Google Coop CodeS-SourceS


Certaines images présentes sur le site (notament certains avatars) sont issues des collections IconShock, donc si vous souhaitez utiliser ces icons vous devez les acheter, ne les copiez pas et ne utilisez pas dans vos sites et applications sans les avoir commandé.