begin process at 2012 05 28 12:46:21
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > 

Code

 > 

Date & Heure

 > CALENDRIER ANNUEL UNIVERSEL AVEC SAINTS DU CALENDRIER ET FÊTES MOBILES

CALENDRIER ANNUEL UNIVERSEL AVEC SAINTS DU CALENDRIER ET FÊTES MOBILES


 Information sur la source

Note :
9,5 / 10 - par 2 personnes
9,50 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Date & Heure Classé sous :calendrier, date pâques, éphémérides, chaînes données, tableaux Niveau :Initié Date de création :02/02/2011 Date de mise à jour :23/02/2011 12:01:36 Vu / téléchargé :5 890 / 380
Auteur : 007Julien

Ecrire un message privé
Commentaire sur cette source (13)
Ajouter un commentaire et/ou une note

 Description

Un script d'encombrement réduit (mois de 7Ko !) affichant le calendrier de l'année à l'ouverture de la page mais susceptible d'afficher par simples clics les différentes années du calendrier grégorien.
Établi à partir de la liste des saints du jour publiée par tefa24600 ce calendrier, de présentation traditionnelle type pompiers ou PTT, indique notamment les fêtes mobiles (mercredi des Cendres, jeudi de l'Ascension et dimanche de Pentecôte) dont les sièges sont liées à celui de la date de Pâques.
Le script illustre la possibilité de stocker des données sous forme de chaînes et donc de fichiers textes ou javascript constituant de mini-bases de données. La généralisation de l'utilisation de tels fichiers pourrait faciliter les transmissions et échanges de données.


  

Source

  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  • <html lang="fr">
  • <head>
  • <meta http-equiv="content-type" content="text/html; charset=utf-8">
  • <meta name="generator" content="PSPad editor, www.pspad.com">
  • <title>Calendrier</title>
  • <style type="text/css">
  • body {margin:0;padding:0;font:10px/13px "Courier New",Courier,monospace}
  • h1 {margin:20px;padding:0;font:16px/20px;text-align:center;}
  • a {text-decoration:none;color:#909;}
  • .mst {font-size:12px}
  • #cal {display:block;position:relative;margin:0 auto;width:840px;height:900px;overflow:hidden;}
  • .clc {display:block;position:absolute;width:200px;padding:1px;background:#fff;}
  • </style>
  • </head>
  • <body>
  • <h1><a href="javascript:newAnn(-20)" title="Recul rapide - 20ans)">««</a>&nbsp;<a href="javascript:newAnn(-1)" title="Année précédente">«</a>&nbsp;Calendrier <span id="ida"></span>&nbsp;<a href="javascript:newAnn(+1)" title="Année suivante">»</a>&nbsp;<a href="javascript:newAnn(+20)" title="Avance rapide - 20 ans">»»</a>&nbsp;</h1>
  • <div id="cal"></div>
  • <script type="text/javascript">
  • var mos='Janvier|Février|Mars|Avril|Mai|Juin|Juillet|Août|Septembre|Octobre|Novembre|Décembre'.split(/\|/g);
  • var tSt="Jour de l'an|St Basile|Ste Geneviève|St Odilon|St Edouard|Ste Mélaine|St Raymond|St Lucien|Ste Alix|St Guillaume|St Paulin|Ste Tatiana|Ste Yvette|Ste Nina|St Rémi|St Marcel|Ste Roseline|Ste Prisca|St Marius|St Sébastien|Ste Agnès|St Vincent|St Barnard|St François de Sales|St Apollos|Ste Paule|Ste Angèle|St Thomas d'Aquin|St Gildas|Ste Martine|Ste Marcelle|Ste Ella|St Théophane|St Blaise|Ste Véronique|Ste Agathe|St Gaston|Ste Eugénie|Ste Jacqueline|Ste Apolline|St Arnaud|ND de Lourdes|St Félix|Ste Béatrice|St Valentin|St Claude|Ste Julienne|St Alexis|Ste Bernadette|St Gabin|Ste Aimée|St Damien|Ste Isabelle|St Lazare|St Modeste|St Roméo|St Nestor|Ste Honorine|St Romain|St Auguste|St Aubin|St Jaouen|St Gwénola|St Casimir|St Olive|Ste Colette|Ste Félicité|St Jean de Dieu|Ste Françoise|St Vivien|Ste Rosine|Ste Justine|St Rodrigue|Ste Mathilde|Ste Louise|Ste Bénédicte|St Patrick|St Cyrille|St Joseph|St Herbert|Ste Clémence|Ste Léa|St Victorien|Ste Karine|Annonciation|Ste Lara|St Habib|St Gontran|Ste Gwladys|St Amédée|St Benjamin|St Hugues|Ste Sandrine|St Richard|St Isidore|Ste Irène|St Marcellin|St Jean-Baptiste|Ste Julie|St Gautier|St Fulbert|St Stanislas|St Jules|Ste Ida|St Maxime|St Paterne|St Benoît-Joseph|St Anicet|St Parfait|Ste Emma|Ste Odette|St Anselme|St Alexandre|St Georges|St Fidèle|St Marc|Ste Alida|Ste Zita|Ste Valérie|Ste Catherine|St Robert|St Jeremie|St Boris|St Philippe|St Sylvain|Ste Judith|Ste Prudence|Ste Gisèle|St Désiré|Ste Pacôme|Ste Solange|Ste Estelle|St Achille|Ste Rolande|St Matthias|Ste Denise|St Honoré|St Pascal|St Eric|St Yves|St Bernardin|St Constantin|St Emile|St Didier|St Donatien|Ste Sophie|St Bérenger|St Augustin|St Germain|St Aymard|St Ferdinand|Ste Perrette|St Justin|Ste Blandine|St Kevin|Ste Clotilde|St Igor|St Norbert|St Gilbert|St Médard|Ste Diane|Ste Trinité|St Barnabé|St Guy|St Antoine|St Elisée|Ste Germaine|St Régis|St Hervé|St Léonce|St Romuald|St Silvère|St Rodolphe|St Alban|Ste Audrey|St Yann|St Prosper|St Anthelme|St Fernand|St Irénée|St Pierre/St Paul|St Martial|St Thierry|St Martinien|St Thomas|St Florent|St Antoine|Ste Mariette|St Eliane|St Thibaud|Ste Amandine|St Ulric|St Benoît|St Olivier|St Henri/St Joël|St Camille/Fête Nationale|St Donald|Ste Carmen|Ste Charlotte|St Frédéric|St Arsène|Ste Marina|St Victor|Ste Marie-Madeleine|Ste Brigitte|Ste Christine|St Jacques|Ste Anne|Ste Nathalie|St Samson|Ste Marthe|Ste Juliette|St Ignace|St Alphonse|St Julien|Ste Lydie|St Jean-Marie|St Abel|St Octavien|St Gaétan|St Dominique|St Amour|St Laurent|Ste Claire|Ste Clarisse|St Hippolyte|St Evrard|Ste Marie/Assomption|St Armel|St Hyacinthe|Ste Hélène|St Jean-Eudes|St Bernard|St Christophe|St Fabrice|Ste Rose|St Barthélémy|St Louis|Ste Natacha|Ste Monique|St Augustin|Ste Sabine|St Fiacre|St Aristide|St Gilles|Ste Ingrid|St Grégoire|Ste Rosalie|Ste Raïssa|St Bertrand|Ste Reine|St Adrien|St Alain|Ste Inès|St Adelphe|St Apollinaire|St Aimé|St Materne|St Roland|Ste Edith|St Renaud|Ste Nadège|Ste Emilie|St Davy|St Matthieu|St Maurice|St Constant|Ste Thècle|St Hermann|St Côme/St Damien|St Vincent de Paul|St Venceslas|Sts Michel|St Jérôme|Ste Thérèse|St Léger|St Gérard|St François|Ste Fleur|St Bruno|St Serge|Ste Pélagie|St Denis|St Ghislain|St Firmin|St Wilfrid|St Géraud|St Juste|Ste Thérèse|Ste Edwige|St Baudouin|St Luc|St René Goupil|Ste Adeline|Ste Céline|Ste Elodie|St Jean de Capistran|St Florentin|St Crépin|St Dimitri|Ste Emeline|St Simon|St Narcisse|Ste Bienvenue|St Quentin|Toussaint|Défunts|St Hubert|St Charles|Ste Sylvie|Ste Bertille|Ste Carine|St Geoffroy|St Théodore|St Léon|St Martin|St Christian|St Brice|St Sidoine|St Albert|Ste Marguerite|Ste Elisabeth|Ste Aude|St Tanguy|St Edmond|Présentation de Marie|Ste Cécile|St Clément|Ste Flora|Ste Catherine|Ste Delphine|St Séverin|St Jacques de la Marche|St Saturnin|St André|Ste Florence|Ste Viviane|St Xavier|Ste Barbara|St Gérald|St Nicolas|St Ambroise|Ste Frida|St Pierre Fourier|St Romaric|St Daniel|Ste Chantal|St Lucie|Ste Odile|Ste Ninon|Ste Alice|St Gaël|St Gatien|St Urbain|St Théophile|St Pierre Canisius|Ste Françoise-Xavière|St Armand|Ste Adèle|Noël|St Etienne|St Jean|St Gaspard|St David|St Roger|St Sylvestre".split(/\|/g);
  • function edtCal(a){
  • var chn='',ms=-1,bs=0,s=Math.floor(a/100),pl=(15-Math.floor(s/4)+s-Math.floor(((s<<3)+13)/25)+19*(a%19))%30,pj,pq,cn,pq,as,pn;
  • if (pl==28) if (10<(a%19)) pl--;else pl++;
  • pj=pl;if (pl!=29 || new Date(a,2,pl).getDay()) pj=pl-new Date(a,2,pl).getDay()+7;
  • cn=new Date(a,2,pj-25).valueOf();pq=new Date(a,2,pj+21).valueOf();
  • as=new Date(a,2,pj+60).valueOf();pn=new Date(a,2,pj+70).valueOf();
  • for (i=1;;i++){cd=new Date(a,0,i);
  • if (cd.getFullYear()!=a) break;
  • if (cd.getMonth()!=ms) {ms=cd.getMonth();
  • if (chn) chn+='</div>';
  • chn+='<div class="clc" style="left:'+((140*ms)%840)+'px;top:'+((ms<6)?0:450)+'px"><b class="mst">'+mos[ms]+'</b><hr>'}
  • if (i==60 && cd.getMonth()==2) bs++;
  • y=z='';if (!cd.getDay()) {y='<u>';z='</u>';}
  • if (cd.valueOf()==cn) chn+='Me '+cd.getDate()+' <b>Cendres *</b><br>';
  • else if (cd.valueOf()==pq) chn+='<u>Di '+cd.getDate()+' <b>Pâques *</b></u><br>';
  • else if (cd.valueOf()==as) chn+='Je '+cd.getDate()+' <b>Ascension *</b><br>';
  • else if (cd.valueOf()==pn) chn+='<u>Di '+cd.getDate()+' <b>Pentecôte *</b></u><br>';
  • else chn+=y+"DiLuMaMeJeVeSa".substr(2*cd.getDay(),2)+' '+cd.getDate()+' '+tSt[i-1+bs]+z+'<br>';}
  • chn+='</div>';
  • document.getElementById('ida').innerHTML=a;
  • document.getElementById('cal').innerHTML=chn;
  • }
  • edtCal(new Date().getFullYear());
  • function newAnn(d){var a=document.getElementById('ida').innerHTML;edtCal(parseInt(a)+d);}
  • </script>
  • </body>
  • </html> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title>Calendrier</title>
<style type="text/css">
body {margin:0;padding:0;font:10px/13px "Courier New",Courier,monospace}
h1 {margin:20px;padding:0;font:16px/20px;text-align:center;}
a {text-decoration:none;color:#909;}
.mst {font-size:12px}
#cal {display:block;position:relative;margin:0 auto;width:840px;height:900px;overflow:hidden;}
.clc {display:block;position:absolute;width:200px;padding:1px;background:#fff;}
</style>
</head>
<body>
<h1><a href="javascript:newAnn(-20)" title="Recul rapide - 20ans)">««</a>&nbsp;<a href="javascript:newAnn(-1)" title="Année précédente">«</a>&nbsp;Calendrier <span id="ida"></span>&nbsp;<a href="javascript:newAnn(+1)" title="Année suivante">»</a>&nbsp;<a href="javascript:newAnn(+20)" title="Avance rapide - 20 ans">»»</a>&nbsp;</h1>
<div id="cal"></div>
<script type="text/javascript">
var mos='Janvier|Février|Mars|Avril|Mai|Juin|Juillet|Août|Septembre|Octobre|Novembre|Décembre'.split(/\|/g);
var tSt="Jour de l'an|St Basile|Ste Geneviève|St Odilon|St Edouard|Ste Mélaine|St Raymond|St Lucien|Ste Alix|St Guillaume|St Paulin|Ste Tatiana|Ste Yvette|Ste Nina|St Rémi|St Marcel|Ste Roseline|Ste Prisca|St Marius|St Sébastien|Ste Agnès|St Vincent|St Barnard|St François de Sales|St Apollos|Ste Paule|Ste Angèle|St Thomas d'Aquin|St Gildas|Ste Martine|Ste Marcelle|Ste Ella|St Théophane|St Blaise|Ste Véronique|Ste Agathe|St Gaston|Ste Eugénie|Ste Jacqueline|Ste Apolline|St Arnaud|ND de Lourdes|St Félix|Ste Béatrice|St Valentin|St Claude|Ste Julienne|St Alexis|Ste Bernadette|St Gabin|Ste Aimée|St Damien|Ste Isabelle|St Lazare|St Modeste|St Roméo|St Nestor|Ste Honorine|St Romain|St Auguste|St Aubin|St Jaouen|St Gwénola|St Casimir|St Olive|Ste Colette|Ste Félicité|St Jean de Dieu|Ste Françoise|St Vivien|Ste Rosine|Ste Justine|St Rodrigue|Ste Mathilde|Ste Louise|Ste Bénédicte|St Patrick|St Cyrille|St Joseph|St Herbert|Ste Clémence|Ste Léa|St Victorien|Ste Karine|Annonciation|Ste Lara|St Habib|St Gontran|Ste Gwladys|St Amédée|St Benjamin|St Hugues|Ste Sandrine|St Richard|St Isidore|Ste Irène|St Marcellin|St Jean-Baptiste|Ste Julie|St Gautier|St Fulbert|St Stanislas|St Jules|Ste Ida|St Maxime|St Paterne|St Benoît-Joseph|St Anicet|St Parfait|Ste Emma|Ste Odette|St Anselme|St Alexandre|St Georges|St Fidèle|St Marc|Ste Alida|Ste Zita|Ste Valérie|Ste Catherine|St Robert|St Jeremie|St Boris|St Philippe|St Sylvain|Ste Judith|Ste Prudence|Ste Gisèle|St Désiré|Ste Pacôme|Ste Solange|Ste Estelle|St Achille|Ste Rolande|St Matthias|Ste Denise|St Honoré|St Pascal|St Eric|St Yves|St Bernardin|St Constantin|St Emile|St Didier|St Donatien|Ste Sophie|St Bérenger|St Augustin|St Germain|St Aymard|St Ferdinand|Ste Perrette|St Justin|Ste Blandine|St Kevin|Ste Clotilde|St Igor|St Norbert|St Gilbert|St Médard|Ste Diane|Ste Trinité|St Barnabé|St Guy|St Antoine|St Elisée|Ste Germaine|St Régis|St Hervé|St Léonce|St Romuald|St Silvère|St Rodolphe|St Alban|Ste Audrey|St Yann|St Prosper|St Anthelme|St Fernand|St Irénée|St Pierre/St Paul|St Martial|St Thierry|St Martinien|St Thomas|St Florent|St Antoine|Ste Mariette|St Eliane|St Thibaud|Ste Amandine|St Ulric|St Benoît|St Olivier|St Henri/St Joël|St Camille/Fête Nationale|St Donald|Ste Carmen|Ste Charlotte|St Frédéric|St Arsène|Ste Marina|St Victor|Ste Marie-Madeleine|Ste Brigitte|Ste Christine|St Jacques|Ste Anne|Ste Nathalie|St Samson|Ste Marthe|Ste Juliette|St Ignace|St Alphonse|St Julien|Ste Lydie|St Jean-Marie|St Abel|St Octavien|St Gaétan|St Dominique|St Amour|St Laurent|Ste Claire|Ste Clarisse|St Hippolyte|St Evrard|Ste Marie/Assomption|St Armel|St Hyacinthe|Ste Hélène|St Jean-Eudes|St Bernard|St Christophe|St Fabrice|Ste Rose|St Barthélémy|St Louis|Ste Natacha|Ste Monique|St Augustin|Ste Sabine|St Fiacre|St Aristide|St Gilles|Ste Ingrid|St Grégoire|Ste Rosalie|Ste Raïssa|St Bertrand|Ste Reine|St Adrien|St Alain|Ste Inès|St Adelphe|St Apollinaire|St Aimé|St Materne|St Roland|Ste Edith|St Renaud|Ste Nadège|Ste Emilie|St Davy|St Matthieu|St Maurice|St Constant|Ste Thècle|St Hermann|St Côme/St Damien|St Vincent de Paul|St Venceslas|Sts Michel|St Jérôme|Ste Thérèse|St Léger|St Gérard|St François|Ste Fleur|St Bruno|St Serge|Ste Pélagie|St Denis|St Ghislain|St Firmin|St Wilfrid|St Géraud|St Juste|Ste Thérèse|Ste Edwige|St Baudouin|St Luc|St René Goupil|Ste Adeline|Ste Céline|Ste Elodie|St Jean de Capistran|St Florentin|St Crépin|St Dimitri|Ste Emeline|St Simon|St Narcisse|Ste Bienvenue|St Quentin|Toussaint|Défunts|St Hubert|St Charles|Ste Sylvie|Ste Bertille|Ste Carine|St Geoffroy|St Théodore|St Léon|St Martin|St Christian|St Brice|St Sidoine|St Albert|Ste Marguerite|Ste Elisabeth|Ste Aude|St Tanguy|St Edmond|Présentation de Marie|Ste Cécile|St Clément|Ste Flora|Ste Catherine|Ste Delphine|St Séverin|St Jacques de la Marche|St Saturnin|St André|Ste Florence|Ste Viviane|St Xavier|Ste Barbara|St Gérald|St Nicolas|St Ambroise|Ste Frida|St Pierre Fourier|St Romaric|St Daniel|Ste Chantal|St Lucie|Ste Odile|Ste Ninon|Ste Alice|St Gaël|St Gatien|St Urbain|St Théophile|St Pierre Canisius|Ste Françoise-Xavière|St Armand|Ste Adèle|Noël|St Etienne|St Jean|St Gaspard|St David|St Roger|St Sylvestre".split(/\|/g);
function edtCal(a){
	var chn='',ms=-1,bs=0,s=Math.floor(a/100),pl=(15-Math.floor(s/4)+s-Math.floor(((s<<3)+13)/25)+19*(a%19))%30,pj,pq,cn,pq,as,pn;
	if (pl==28) if (10<(a%19)) pl--;else pl++;
	pj=pl;if (pl!=29 || new Date(a,2,pl).getDay()) pj=pl-new Date(a,2,pl).getDay()+7;
	cn=new Date(a,2,pj-25).valueOf();pq=new Date(a,2,pj+21).valueOf();
	as=new Date(a,2,pj+60).valueOf();pn=new Date(a,2,pj+70).valueOf();
	for (i=1;;i++){cd=new Date(a,0,i);
		if (cd.getFullYear()!=a) break;
		if (cd.getMonth()!=ms) {ms=cd.getMonth();
			if (chn) chn+='</div>';
			chn+='<div class="clc" style="left:'+((140*ms)%840)+'px;top:'+((ms<6)?0:450)+'px"><b class="mst">'+mos[ms]+'</b><hr>'}
		if (i==60 && cd.getMonth()==2) bs++;
		y=z='';if (!cd.getDay()) {y='<u>';z='</u>';}
		if (cd.valueOf()==cn) chn+='Me '+cd.getDate()+' <b>Cendres *</b><br>';
		else if (cd.valueOf()==pq) chn+='<u>Di '+cd.getDate()+' <b>Pâques *</b></u><br>';
		else if (cd.valueOf()==as) chn+='Je '+cd.getDate()+' <b>Ascension *</b><br>';
		else if (cd.valueOf()==pn) chn+='<u>Di '+cd.getDate()+' <b>Pentecôte *</b></u><br>';
		else chn+=y+"DiLuMaMeJeVeSa".substr(2*cd.getDay(),2)+' '+cd.getDate()+' '+tSt[i-1+bs]+z+'<br>';}
	chn+='</div>';
	document.getElementById('ida').innerHTML=a;
	document.getElementById('cal').innerHTML=chn;
}
edtCal(new Date().getFullYear());
function newAnn(d){var a=document.getElementById('ida').innerHTML;edtCal(parseInt(a)+d);}
</script>
</body>
</html>

 Conclusion

Ce script illustre les souplesse et puissance de pages html munies de simples scripts, elles rendent caduques nombre de documents anciens dont les évolutions devraient ouvrir de larges perspectives...    

 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Historique

04 février 2011 11:03:23 :
Correction du mercredi des Cendres
04 février 2011 11:18:00 :
Correction du commentaire où les accents typographiques (les vrais obtenus avec Alt 0146 ou sur les portables Alt Fn) ne passaient pas avec le charset du site.
08 février 2011 12:47:03 :
Suppression d'un top:0 inutile dans le style clc des colonnes du calendrier, correction de la ligne de soulignement des dimanches (if portant sur les deux éléments y et z) et simplification du calcul de la position ((ms<6)?0:450) au lieu de ((140*ms<820)?0:450).
23 février 2011 12:01:36 :
Correction et téléchargement du zip modifié pour le mercredi des Cendres. Adaptation des mots clefs

 Sources du même auteur

Source avec Zip Source avec une capture PUISSANCE 4
ÉCRIRE UN MONTANT MONÉTAIRE SOUS FORME LITTÉRALE
Source avec Zip LE COMPTE EST BON
Toutes les sources de 007Julien

 Sources de la même categorie

NOMBRE DE JOURS, MOIS ET ANNÉES DEPUIS LA NAISSANCE par marcenana
OBTENIR LE NOMBRE DE JOURS D'UN MOIS SUIVANT SON ANNÉE par hugolegrand
SAINT DU JOUR par tefa24600
Source avec Zip Source avec une capture NIPCLOCK 1.2 par neep
COMPTE À REBOURS POUR ÉVÉNEMENTS À RÉPÉTITION par CSIBern
Toutes les sources de la catégorie Date & Heure

 Sources en rapport avec celle ci

CONSTRUCTION D'UNE TABLE TRIABLE À PARTIR D'UN TABLEAU 2D par phm
Source avec Zip EZEDITTABLE par koalyptus
SAINT DU JOUR par tefa24600
Source avec une capture JEU DE COULEURS DANS UN TABLEAU À 3 DIMENSION par Niidhogg
Source avec Zip Source avec une capture CALCULS RAYNAUX V2 par Ali Bibi

Commentaires et avis

Commentaire de engelein le 04/02/2011 10:47:07

bonjour,
pour que le mercredi des cendres tombe à la bonne date, il faut remplacer dans la ligne 26: cn=new Date(a,2,pj-35).valueOf();par: cn=new Date(a,2,pj-25).valueOf();
bonne journée

Commentaire de 007Julien le 04/02/2011 11:12:35

Effectivement, j'avais laissé passer cette coquille... Je viens de rectifier le script proposé. Merci cette aimable attention et participation.

Commentaire de francislulu le 07/02/2011 09:40:08

bonjour, apparemment en téléchargement c'est toujours le calendrier non rectifié, sans les accents !!!!!

Commentaire de tefa24600 le 07/02/2011 10:16:36 9/10

Très bon code (pour l'avoir testé en avant première !) :p

Je ne mets pas 10 car un code n'est jamais parfait (sinon on s'em....rait) !

Commentaire de 007Julien le 07/02/2011 10:52:01

C'est vrai, le calendrier en téléchargement est à rectifier en ce qui concerne le mercredi des Cendres.

Maintenant pour les accents, le jeu de caractère annoncé étant utf-8 (voir le charset à la fin de la ligne n°4), il convient d'enregistrer ce fichier avec ce même jeu de caractères pour retrouver les accents ou bien encore de modifier le charset en conséquence).

Quant à la modification effectuée elle visait à remplacer non pas les accents  typographiques (encore une erreur de ma part) mais les seules apostrophes typographiques...

Enfin, de bons graphistes pourraient sans doute améliorer la présentation de ce calendrier.

Commentaire de jtoto le 07/02/2011 23:36:38 10/10

je ne suis pas un pro de javascript je souhaiterais espacer les différents mois  mais je ne voi spas comment faire avec le .clc {display:block;position:absolute;.... car en fait les mois se chevauchent quand on augmente la police de caractères. quelqu'un peut  il m'indiquer la solution pour augmenter la police et avoir le texte complet!!! merci pour votre aide

Commentaire de 007Julien le 08/02/2011 01:03:36

En toute hypothèse, Il sera difficile d'afficher l'intégralité des lignes telles que St Camille/Fête Nationale. Peut-être conviendra-t-il d'opérer des choix...

Sinon, la classe clc est complétée par l'attribut style (ligne 32) qui définit la position de chaque (container de) mois à l'intérieur du container cal.

Ainsi les mois, dont la largeur (200px) doit être suffisante pour éviter les retours à la ligne, se chevauchent avec des décalages latéraux plus faibles (140px). La largeur limitée du container cal 6x140=840px, avec un overflow:heidden, masque les débordements des mois de juin et décembre.

Sur la verticale, le décalage de 450 px qui intervient à partir du mois de juillet (avec la condition 'top:'+((140*ms<820)?0:450)+'px' qui pourrait être simplifiée en 'top:'+((ms<6)?0:450)+'px) et la hauteur totale du container (le double) doivent être adaptés à la hauteur de ligne de 13px (font:10px/13px sur la ligne 8) de manière à dégager de l'ordre de 34 lignes (34x13=452) pour la hauteur totale des mois.

Ces indications devraient permettre toutes adaptations liées au changement de nature ou de taille de la police de caractère...

Commentaire de 007Julien le 08/02/2011 01:34:31

Peut-être pourrait-on faire en sorte, avec un z-index, que les mois «prennent le dessus» au passage de la souris de manière à autoriser la lecture des lignes dans leur intégralité ? Encore conviendrait-il de régler le sort des mois de juin et décembre ?

Commentaire de PETITCLIC le 28/02/2011 19:55:21

Bonjour, j'ose mon premier post. C'est surtout pour avoir vos critiques et améliorer mon niveau amateur.
Tout d'abord, pour la largeur des colonnes mois, j'ai remplacé 960px par 1200px (ligne13).
Puis en ligne 32 : (160*ms)%960 par (200*ms)%1200, car 6x200=1200.
on fait ainsi varier la largeur par des multiples de 6.
A bientôt,
Et merci 007Julien, ce calendrier est très intéressant.

Commentaire de PETITCLIC le 28/02/2011 20:24:02

Je voulais afficher le numéro de semaine, et je propose cette solution en m'inspirant de la solution de Marmotte86 (http://www.javascriptfr.com/codes/CALENDRIER-MOIS-ANNEE-AVEC-AFFICHAGE-NUMEROS-SEMAINE_32185.aspx)

Ligne 24 : déclaration de 3 variables supplémentaires : plundi (premier lundi de l'année); pjeudi (premier jeudi de l'année); et sem (pour le numéro de semaine).

Insertion de 4 lignes après la ligne 28 :
for (x=1;;x++) { plundi=new Date(a,0,x);
if (plundi.getDay()==1) break ;}
for (x=1;;x++) { pjeudi=new Date(a,0,x);
if (pjeudi.getDay()==4) break ;}

Insertion de 5 lignes après la ligne 34 ("if (i==60 && cd.getMonth()==2) bs++;") qui est devenu 38 :
sem=Math.ceil((cd.getTime()-plundi.getTime()+86400*1000)/(86400*1000*7));
if (plundi>pjeudi) sem+=1;
sem+=' ';
if (sem<10) sem+='&nbsp;';
if (cd.getDay()!=3 && cd.getDay()!=4) sem='&nbsp;&nbsp;&nbsp;';

Enfin ne pas oublier d'inclure sem en début de chaine dans les lignes suivantes concernant les jours fériés (question d'esthétique).

Et biensûr dernière ligne : else chn+=y+sem+"DiLuMa......etc
Voilà, j'espère que mes explications ne sont pas trop brouillonnes, et surtout qu'il n'y a pas d'erreur.

Commentaire de PETITCLIC le 28/02/2011 20:31:41

Désolé,
soustrayez 1 à mes numéros de lignes dans mes derniers commentaires.

Commentaire de LeFauve42 le 14/03/2011 12:45:40

Bonjour,

Est-ce que quelqu'un aurait mis ce script en ligne quelque part, afin qu'on puisse voir a quoi ca ressemble ?

Eric

Commentaire de jtoto le 14/03/2011 15:11:41

voici une variante du très bon programme développé par 007julien si cela peut rendre service à quelqu'un je le joint:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title>Calendrier</title>
<style type="text/css">
body {margin:0;padding:0;font:12px/13px Arial,Courier,monospace}
h1 {margin:20px;padding:0;font:16px/20px;text-align:center;}
a {text-decoration:none;color:#909;}
.mst {font-size:16px}
.dim { background-color:yellow; padding:0px; margin:0px; }
.jannee { background-color:#d3d3d3; padding:0px; margin:0px; }
#cal {display:block;position:relative;margin: 0 auto;width:1140px;height:900px;overflow:hidden;}
//.clc {display:block;position:absolute;border: 1px dotted red;top:0px;width:190px;padding:0px;background:#fff;}
.clc {display:block;position:absolute;top:0px;width:190px;padding:0px;background:#fff;}
</style>
</head>
<body>
<h1><a href="javascript:newAnn(-20)" title="Recul rapide - 20ans)">««</a>&nbsp;<a href="javascript:newAnn(-1)" title="Année précédente">«</a>&nbsp;Calendrier <span id="ida"></span>&nbsp;<a href="javascript:newAnn(+1)" title="Année suivante">»</a>&nbsp;<a href="javascript:newAnn(+20)" title="Avance rapide - 20 ans">»»</a>&nbsp;</h1>

<div id="cal"></div>
<script type="text/javascript">
var mos='Janvier|Février|Mars|Avril|Mai|Juin|Juillet|Août|Septembre|Octobre|Novembre|Décembre'.split(/\|/g);
var tSt="Jour de l'An|Basile|Geneviève|Odilon|Edouard|Mélaine|Raymond|Lucien|Alix|Guillaume|Paulin|Tatiana|Yvette|Nina|Rémi|Marcel|Roseline|Prisca|Marius|Sébastien|Agnès|Vincent|Barnard|François de Sales|Apollos|Paule|Angèle|Thomas d'Aquin|Gildas|Martine|Marcelle|Ella|Théophane|Blaise|Véronique|Agathe|Gaston|Eugénie|Jacqueline|Apolline|Arnaud|ND de Lourdes|Félix|Béatrice|Valentin|Claude|Julienne|Alexis|Bernadette|Gabin|Aimée|Damien|Isabelle|Lazare|Modeste|Roméo|Nestor|Honorine|Romain|Auguste|Aubin|Jaouen|Guénolé|Casimir|Olive|Colette|Félicité|Jean de Dieu|Françoise|Vivien|Rosine|Justine|Rodrigue|Mathilde|Louise|Bénédicte|Patrick|Cyrille|Joseph|Herbert|Clémence|Léa|Victorien|Karine|Annonciation|Lara|Habib|Gontran|Gwladys|Amédée|Benjamin|Hugues|Sandrine|Richard|Isidore|Irène|Marcellin|Jean-Baptiste|Julie|Gautier|Fulbert|Stanislas|Jules|Ida|Maxime|Paterne|Benoît-Joseph|Anicet|Parfait|Emma|Odette|Anselme|Alexandre|Georges|Fidèle|Marc|Alida|Zita|Valérie|Catherine|Robert|Jérémie / Fête du Travail|Boris|Philippe|Sylvain|Judith|Prudence|Gisèle|Désiré|Pacôme|Solange|Estelle|Achille|Rolande|Matthias|Denise|Honoré|Pascal|Eric|Yves|Bernardin|Constantin|Emile|Didier|Donatien|Sophie|Bérenger|Augustin|Germain|Aymard|Ferdinand|Perrette|Justin|Blandine|Kevin|Clotilde|Igor|Norbert|Gilbert|Médard|Diane|Trinité|Barnabé|Guy|Antoine|Elisée|Germaine|Régis|Hervé|Léonce|Romuald|Silvère|Rodolphe|Alban|Audrey|Yann|Prosper|Anthelme|Fernand|Irénée|Pierre / Paul|Martial|Thierry|Martinien|Thomas|Florent|Antoine|Mariette|Eliane|Thibaud|Amandine|Ulric|Benoît|Olivier|Henri / Joël|Camille / Fête Nationale|Donald|Carmen|Charlotte|Frédéric|Arsène|Marina|Victor|Marie-Madeleine|Brigitte|Christine|Jacques|Anne|Nathalie|Samson|Marthe|Juliette|Ignace|Alphonse|Julien|Lydie|Jean-Marie|Abel|Octavien|Gaétan|Dominique|Amour|Laurent|Claire|Clarisse|Hippolyte|Evrard|Marie / Assomption|Armel|Hyacinthe|Hélène|Jean-Eudes|Bernard|Christophe|Fabrice|Rose|Barthélémy|Louis|Natacha|Monique|Augustin|Sabine|Fiacre|Aristide|Gilles|Ingrid|Grégoire|Rosalie|Raïssa|Bertrand|Reine|Adrien|Alain|Inès|Adelphe|Apollinaire|Aimé|Materne|Roland|Edith|Renaud|Nadège|Emilie|Davy|Matthieu|Maurice|Constant|Thècle|Hermann|Côme / Damien|Vincent de Paul|Venceslas|Sts Michel|Jérôme|Thérèse|Léger|Gérard|François|Fleur|Bruno|Serge|Pélagie|Denis|Ghislain|Firmin|Wilfrid|Géraud|Juste|Thérèse|Edwige|Baudouin|Luc|René Goupil|Adeline|Céline|Elodie|Jean de Capistran|Florentin|Crépin|Dimitri|Emeline|Simon|Narcisse|Bienvenue|Quentin|Toussaint|Défunts|Hubert|Charles|Sylvie|Bertille|Carine|Geoffroy|Théodore|Léon|Martin / Admistice 1918|Christian|Brice|Sidoine|Albert|Marguerite|Elisabeth|Aude|Tanguy|Edmond|Présentation de Marie|Cécile|Clément|Flora|Catherine|Delphine|Séverin|Jacques de la Marche|Saturnin|André|Florence|Viviane|Xavier|Barbara|Gérald|Nicolas|Ambroise|Frida|Pierre Fourier|Romaric|Daniel|Chantal|Lucie|Odile|Ninon|Alice|Gaël|Gatien|Urbain|Théophile|Pierre Canisius|Françoise-Xavière|Armand|Adèle|Noël|Etienne|Jean|Gaspard|David|Roger|Sylvestre".split(/\|/g);
var annee=new Date().getFullYear();
var mois=new Date().getMonth();
var jour=new Date().getDate();

function edtCal(a){

var chn='',ms=-1,bs=0,s=Math.floor(a/100),pl=(15-Math.floor(s/4)+s-Math.floor(((s<<3)+13)/25)+19*(a%19))%30,pj,pq,cn,pq,as,pn;
if (pl==28) if (10<(a%19)) pl--;else pl++;
pj=pl;if (pl!=29 || new Date(a,2,pl).getDay()) pj=pl-new Date(a,2,pl).getDay()+7;
mg=new Date(a,2,pj-26).valueOf();ra=new Date(a,2,pj+14).valueOf();
cn=new Date(a,2,pj-25).valueOf();pq=new Date(a,2,pj+21).valueOf();
   as=new Date(a,2,pj+60).valueOf();pn=new Date(a,2,pj+70).valueOf();
   lpq=new Date(a,2,pj+22).valueOf();lpn=new Date(a,2,pj+71).valueOf();
for (i=1;;i++){cd=new Date(a,0,i);

if (cd.getFullYear()!=a) break;
if (cd.getMonth()!=ms) {ms=cd.getMonth();
if (chn) chn+='</div>';
chn+='<div class="clc" style="left:'+((190*ms)%1140)+'px;top:'+((140*ms<820)?0:450)+'px"><b class="mst">'+mos[ms]+'</b><hr>'}
if (i==60 && cd.getMonth()==2) bs++;
y=z=' ';if (!cd.getDay()) {
    if ("DiLuMaMeJeVeSa".substr(2*cd.getDay(),2) == "Di") y='<p class="dim">';z='</p>';}
      else {z='<br>'};
jy=jz=' ';if (a==annee && cd.getDate()==jour && cd.getMonth()== mois){jy='<p class="jannee">';jz='</p>';}
          else {jz='<br>'};


//chn+=cd.getDate()+' '+ cd.getMonth()+  ' ' +a+' ' +jour+' ' +mois+' ' +annee+' ' ;

if (cd.valueOf()==mg) chn+=jy+'Ma '+cd.getDate()+' '+tSt[i-1+bs]+' / Mardi Gras '+jz;
   else if (cd.valueOf()== cn) chn+=jy+'Me '+cd.getDate()+' '+tSt[i-1+bs]+' / Cendres '+jz;
    else if (cd.valueOf()== ra) chn+='<p class="dim">Di '+cd.getDate()+' '+tSt[i-1+bs]+' / Rameaux </p>';
else if (cd.getMonth() == 0 && cd.getDate() == 1) chn+='<b><font color=red>'+y+"DiLuMaMeJeVeSa".substr(2*cd.getDay(),2)+' 1 Jour de l\'An</font>'+z+'</b>';
else if (cd.getMonth() == 4 && cd.getDate() == 1) chn+='<b><font color=red>'+y+"DiLuMaMeJeVeSa".substr(2*cd.getDay(),2)+' 1 Jérémie / Fête du Travail</font>'+z+'</b>';
else if (cd.getMonth() == 4 && cd.getDate() == 8) chn+='<b><font color=red>'+y+"DiLuMaMeJeVeSa".substr(2*cd.getDay(),2)+' 8 Désiré / Victoire 1945</font>'+z+'</b>';
else if (cd.getMonth() == 6 && cd.getDate() == 14) chn+='<b><font color=red>'+y+"DiLuMaMeJeVeSa".substr(2*cd.getDay(),2)+' 14 Camille / Fête Nationale</font>'+z+'</b>';
else if (cd.getMonth() == 7 && cd.getDate() == 15) chn+='<b><font color=red>'+y+"DiLuMaMeJeVeSa".substr(2*cd.getDay(),2)+' 15 Marie / Assomption</font>'+z+'</b>';
else if (cd.getMonth() == 10 && cd.getDate() == 1) chn+='<b><font color=red>'+y+"DiLuMaMeJeVeSa".substr(2*cd.getDay(),2)+' 1 Toussaint</font>'+z+'</b>';
else if (cd.getMonth() == 10 && cd.getDate() == 11) chn+='<b><font color=red>'+y+"DiLuMaMeJeVeSa".substr(2*cd.getDay(),2)+' 11 Martin / Admistice 1918</font>'+z+'</b>';
else if (cd.getMonth() == 11 && cd.getDate() == 25) chn+='<b><font color=red>'+y+"DiLuMaMeJeVeSa".substr(2*cd.getDay(),2)+' 25 Noël</font>'+z+'</b>';
else if (cd.valueOf()==pq) chn+='<b><font color=red ><p class="dim">Di '+cd.getDate()+' '+tSt[i-1+bs]+' / Pâques</p></font></b>';
else if (cd.valueOf()==lpq) chn+='<b><font color=red>Lu '+cd.getDate()+' Marc</font></b><br>';
else if (cd.valueOf()==as) chn+='<b><font color=red>Je '+cd.getDate()+' '+tSt[i-1+bs]+' / Ascension</font></b><br>';
else if (cd.valueOf()==pn) chn+='<b><font color=red><p class="dim">Di '+cd.getDate()+' '+tSt[i-1+bs]+' / Pentecôte</p></font></b>';
else if (cd.valueOf()==lpn) chn+='<b><font color=red>Lu '+cd.getDate()+' Antoine</font></b><br>';
else if (a==annee && cd.getDate()==jour && cd.getMonth()== mois)   chn+=jy+'<b>'+"DiLuMaMeJeVeSa".substr(2*cd.getDay(),2)+' '+cd.getDate()+' '+tSt[i-1+bs]+'</b>'+jz;


else chn+=y+"DiLuMaMeJeVeSa".substr(2*cd.getDay(),2)+' '+cd.getDate()+' '+tSt[i-1+bs]+z;}
chn+='</div>';
document.getElementById('ida').innerHTML=a;
document.getElementById('cal').innerHTML=chn;
}
edtCal(new Date().getFullYear());
function newAnn(d){var a=document.getElementById('ida').innerHTML;edtCal(parseInt(a)+d);}

</script>
</body>
</html>

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

Redimensionnement de tableaux sous javascript/netscape [ par Blasteur ] Bonjour à tous!Je souhaite redimensionner dynamiquement un tableau (du nom de 'CESSION') grâce à une fonction javascript.Le problème c'est que le code un calendrier bien special [ par kabouya ] bonjour,j'ai besoin d'un calandrier javascript qui me donne uniquement le debut et la fin de chaque mois. par exemple une entete on l'on peu choisir l 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 DateTimePicker [ par theboboteam ] Bonjour, peut on utiliser l'activeX DateTimePicker en javascript pour afficher un calendrier dans mes pages htm?j'ai bien vue des sources de calendrie Une question pour mon calendrier [ par syltouille ] Bonjour et bonne annee tout le monde.Mon premier souci de cette annee est:J'ai realise un calendrier en PHP avec des images pour chaque jour.- Je voud téléchargement d'un calendrier en javascript [ par FIFI69 ] il n'y a rien dans le téléchargement, seulement des raccourcis et des liens. Javascrip et Requete SQL [ par chris81 ] bonjour,je possede un calendrier en javascript qui me retourne un jour, un mois et une annee. Comment puis je faire pour inserer ce que me retourne c calendrier dans infobulle !!!! [ par roninou ] j'essai desesperement de mettre une calendrier dans une infobulle pour que l'utilisateur puisse choisir la date qu'il veut.j'ai deja le code pour crée Les tableaux, dimension automatique! [ par shansen ] salut a tous!alors voila ,j'ai des tableaux comme ca: _________________ | 1 | 2 | |________| | javascript, RTE et tableaux [ par mondokwondo ] Bonjour a tous! voila je suis tres novice en javascript mais je reprend en ce moment un RTE (rich text editor) orienté WYSIWYG et seul un probleme ent


Nos sponsors


Sondage...

Comparez les prix


Motorola MILESTONE
Entre 489€ et 489€

Visiter le guide achat

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), 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

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,390 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)