Fermer

Visiteur non-identifié | Identifiez-vous | Devenir membre
Code perdu ? | Combien de visiteurs sur votre site ?

Calendrier dynamique

Script posté par :

krucial - (Site : L'éditeur JavaScript)
Vous aussi, postez vos scripts en cliquant ici.

Description

Pas vraiment une portion de code, pluto un script complet envoyé par un de nos visiteurs.

Compatibilité :

	FireFox : Incompatible
	Mozilla : Incompatible
	Netscape Navigator : Incompatible
	Internet Explorer : 4 et +

Ce script utilise le DHTML

Chiffres :

Date de création : 13/04/2003
Dernière modif : -
Visites de la page : 131898
Envois par mail : 3428

Exemple :

Le code :

Entre <HEAD> et </HEAD> :

<SCRIPT LANGUAGE="JavaScript">
/*
SCRIPT TROUVE SUR L'EDITEUR JAVASCRIPT
http://www.editeurjavascript.com
*/
/*******************************************************
* CALENDRIER GREGORIEN PERPETUEL v1.0 *
* par SKAMP (skamp@befrance.com) (09/09/2000) *
********************************************************
* Ce script permet de choisir un mois et une annee en *
* particulier, afin d'afficher dynamiquement le *
* calendrier correspondant. Par defaut c'est celui du *
* mois courant qui s'affiche. Note : la 1ere semaine *
* de l'annee commence le 1er lundi. *
* *
* Le code suivant s'inspire de celui de Jean-Michel *
* Berthier (berth@cybercable.fr, *
* perso.cybercable.fr/berth/jstips/calendrier.htm). *
* *
* MODIFICATIONS NECESSAIRES POUR PORTAGE VERS D'AUTRES *
* NAVIGATEURS : N'A ETE TESTE QUE SOUS MICROSOFT *
* INTERNET EXPLORER 5.00.2614.3500 *
*******************************************************/
var HTMLCode = "";
var DaysList = new Array("Jour_Vide", "Lun", "Mar", "Mer", "Jeu", "Ven", "Sam", "Dim");
var MonthsList = new Array("Mois_Vide", "Janvier", "Février", "Mars", "Avril", "Mai", "Juin", "Juillet", "Août", "Septembre", "Octobre", "Novembre", "Décembre");
var MonthLength = new Array("Mois_longueur_vide",31,29,31,30,31,30,31,31,30,31,30,31);

var QueryDate = 0; /* Jour demande (date)*/
var QueryMonth = 0; /* Mois demande*/
var QueryYear = 0; /* Annee demandee*/
var QueryDay = 0; /* Jour de la semaine du jour demande, inconnu*/
var FirstDay = 0; /* Jour de la semaine du 1er jour du mois*/
var WeekRef = 0; /* Numerotation des semaines*/
var WeekOne = 0; /* Numerotation des semaines*/

var Today = new Date();
var TodaysYear = Today.getYear();
var TodaysMonth = Today.getMonth() + 1;
var TodaysDate = Today.getDate();
var TodaysDay = Today.getDay() + 1;
if (TodaysYear < 2000) { TodaysYear += 1900; }

/* On commence par verifier les donnees fournies par l'utilisateur*/
function CheckData()
{
QueryDate = document.Cal.Date.selectedIndex + 1;
QueryMonth = document.Cal.Month.selectedIndex + 1;
QueryYear = (document.Cal.Century.selectedIndex + 15) * 100 + document.Cal.Year.selectedIndex;
MonthLength[2] = CheckLeap(QueryYear);

/* on teste si la date choisie est anterieure au lundi 20 decembre 1582*/
if ((QueryYear * 10000 + QueryMonth * 100 + QueryDate) < 15821220)
{
alert("Vous avez choisi une date antérieure au 20 décembre 1582, hors du calendrier Grégorien. \nVeuillez sélectionner une date plus récente.");
document.Cal.reset();
CheckData();
}
else if (MonthLength[QueryMonth] < QueryDate) /* on verifie si la date est coherente*/
{
alert("Il n'y a pas " + QueryDate + " jours en " + MonthsList[QueryMonth] + " " + QueryYear + " mais " + MonthLength[QueryMonth] + ". \nVeuillez choisir une autre date.");
document.Cal.reset();
CheckData();
}
else { DisplaySchedule(); }

}
/* Teste une annee pour determiner si elle est bissextile ou pas*/
function CheckLeap(yy)
{
if ((yy % 100 != 0 && yy % 4 == 0) || (yy % 400 == 0)) { return 29; }
else { return 28; }
}

/* Renvoie le numero de la semaine correspondant a la date requise*/
function DefWeekNum(dd)
{
numd = 0;
numw = 0;
for (n=1; n<QueryMonth; n++)
{
numd += MonthLength[n];
}
numd = numd + dd - (9 - DefDateDay(QueryYear,1,1));
numw = Math.floor(numd / 7) + 1;

if (DefDateDay(QueryYear,1,1) == 1) { numw++; }
return numw;
}

/* Renvoie le numero du jour de la semaine correspondant a la date requise */
function DefDateDay(yy,mm,dd)
{
return Math.floor((Date2Days(yy,mm,dd)-2) % 7) + 1;
}

/* Transforme la date en nb de jours theoriques */
function Date2Days(yy,mm,dd)
{
if (mm > 2)
{
var bis = Math.floor(yy/4) - Math.floor(yy/100) + Math.floor(yy/400);
var zy = Math.floor(yy * 365 + bis);
var zm = (mm-1) * 31 - Math.floor(mm * 0.4 + 2.3);
return (zy + zm + dd);
}
else
{
var bis = Math.floor((yy-1)/4) - Math.floor((yy-1)/100) + Math.floor((yy-1)/400);
var zy = Math.floor(yy * 365 + bis);
return (zy + (mm-1) * 31 + dd);
}
}

/* Produit le code HTML qui formera le calendrier */
function DisplaySchedule()
{
HTMLCode = "<table cellspacing=0 cellpadding=3 border=3 bordercolor=#000033>";
QueryDay = DefDateDay(QueryYear,QueryMonth,QueryDate);
WeekRef = DefWeekNum(QueryDate);
WeekOne = DefWeekNum(1);
HTMLCode += "<tr align=center><td colspan=8 class=TITRE><b>" + MonthsList[QueryMonth] + " " + QueryYear + "</b></td></tr><tr align=center>";

for (s=1; s<8; s++)
{
if (QueryDay == s) { HTMLCode += "<td><b><font color=#ff0000>" + DaysList[s] + "</font></b></td>"; }
else { HTMLCode += "<td><b>" + DaysList[s] + "</b></td>"; }
}

HTMLCode += "<td><b><font color=#888888>Sem</font></b></td></tr>";
a = 0;

for (i=(1-DefDateDay(QueryYear,QueryMonth,1)); i<MonthLength[QueryMonth]; i++)
{
HTMLCode += "<tr align=center>";
for (j=1; j<8; j++)
{
if ((i+j) <= 0) { HTMLCode += "<td>&nbsp;</td>"; }
else if ((i+j) == QueryDate) { HTMLCode += "<td><b><font color=#ff0000>" + (i+j) + "</font></b></td>"; }
else if ((i+j) > MonthLength[QueryMonth]) { HTMLCode += "<td>&nbsp;</td>"; }
else { HTMLCode += "<td>" + (i+j) + "</td>"; }
}

if ((WeekOne+a) == WeekRef) { HTMLCode += "<td><b><font color=#00aa00>" + WeekRef + "</font></b></td>"; }
else { HTMLCode += "<td><font color=#888888>" + (WeekOne+a) + "</font></td>"; }
HTMLCode += "</tr>";
a++;
i = i + 6;
}

Calendrier.innerHTML = HTMLCode + "</table>";
}
</SCRIPT>
<STYLE type="text/css">

</STYLE>

Entre <BODY> et </BODY> :

<form name="Cal"><center>
<br><br><br><h3>CALENDRIER PERPETUEL</h3>
<script language="JavaScript1.2" type="text/javascript">
/* AFFICHE LES 4 MENUS DEROULANTS PERMETTANT DE
SELECTIONNER LE JOUR, LE MOIS ET L'ANNEE
**************************************************/
DateText = "<select name=\"Date\">"
for (d=1; d<32; d++)
{
DateText += "<option";
if (d == TodaysDate) { DateText += " SELECTED"; }
DateText += ">";
if (d < 10) { DateText += "0"; }
DateText += d + "</option>";
}
DateText += "</select>";
/*************************************************/
MonthText = "<select name=\"Month\">"
for (m=1; m<13; m++)
{
MonthText += "<option";
if (m == TodaysMonth) { MonthText += " SELECTED"; }
MonthText += ">";
MonthText += MonthsList[m] + "</option>";
}
MonthText += "</select>";
/*************************************************/
CenturyText = "<select name=\"Century\">"
for (c=15; c<25; c++)
{
CenturyText += "<option";
if (c == Math.floor(TodaysYear / 100)) { CenturyText += " SELECTED"; }
CenturyText += ">" + c + "</option>";
}
CenturyText += "</select>";
/*************************************************/
YearText = "<select name=\"Year\">";
for (y=0; y<100; y++)
{
YearText += "<option";
if (y == (TodaysYear - Math.floor(TodaysYear / 100) * 100)) { YearText += " SELECTED"; }
YearText += ">";
if (y < 10) { YearText += "0"; }
YearText += y + "</option>";
}
YearText += "</select>";
/*************************************************/
document.write(DateText + MonthText + CenturyText + YearText);
</script><input type="button" value=" OK " style="font-weight: bold" onClick="CheckData()"><br><br>
<input type="button" value=" Revenir à la date courante " style="font-weight: bold" onClick="document.Cal.reset();CheckData()">
<br><br><br>
<div id="Calendrier"></div>
</center></form>
<script language="JavaScript1.2" type="text/javascript">CheckData()</script>

Services email :

Je désire recevoir ce script par email
Je désire recevoir un email en cas de modification de ce script
Je désire m'abonner à la newsletter de l'éditeur JavaScript

Les annotations des visiteurs :

De zbilb - le 25-07-2004

Ce script fonctionne à merveille avec Safari, le navigateur d'Apple.

De underslash - le 19-12-2004

Il fonctionne également très bien sur Firefox 1.0

De clonedaemon - le 23-12-2004

Il me semble compatible avec Firefox ...

De demonofparadise - le 21-05-2005

C'est exact, le Script marche très bien sous Mozilla Firefox!
^^

De Zinc - le 19-09-2005

Certains disent le code compatible avec Firefox...
Par quelle magie??
Plus sérieusement, si quelqu'un a résolu le problème de compatibilité du calendrier avec Firefox/Netscape/... qu'il fasse signe!
Cela-dit, bon code!

De pmn@ntes - le 27-06-2006

Ce script fonctionne parfaitement avec Firefox, par contre avec Netscape 7.2 il faut utiliser "document.getElementById("Calendrier").innerHTML = " pour afficher la grille.

Une question tout de même, l'année 2100 ne devrait-t-elle pas être bissextile ?

De 6po - le 03-08-2006

Non 2100 n'est pas bissextile.

Pour etre bissextile...
l'année doit etre multiple de 4

4 8 .... 2000 .... 2004 .... 2100 :D

Donc oui 2100 est multiple de 4 mais il y à une 2e règle...

Si le nombre est un multiple de 100... donc 2000 2100 et multiple de 400... donc 2000 2400 alors il est bissextile ...

2100 est multiple de 4, de 100 mais pas de 400 :)

Ce qui en code simple:

Si année mod 4 = 0
Si année mod 100 = 0
Si année mod 400 = 0
Retour Vrai
Sinon
Retour Faux
Fin SI
Sinon
Retour Vrai
Fin Si
Sinon
Retour Faux
Fin Si

De babouille - le 19-12-2006

Salut, il y a un petit problème sur la numérotation des semaines.
Exemple : La première semaine de 2008 contient le lundi 31/12/2007
alors qu'avec ce script, la première semaine de l'année commence avec le premier lundi de l'année.

A+

De sam6ber - le 02-02-2007

Bonjour à tous,
J'aurais voulu savoir si on pouvais mettre ce script en externe? Je crois qu'on peut créer un fichier.js et faire appel à lui mais je ne sais pa comment faire.Si quelqu'un pouvais me renseigner. Merci d'avance!

>> Poster une annotation sur ce script

6 visiteurs
actuellement en ligne

PUBLICITE

ANNUAIRE WEBMAST.

AOL
Un des plus gros FAI mondial.
ttp://adsl.aol.fr/

Cat : Haut débit
Voir l'annuaire webmaster

LES SCRIPTS :

78 à éditer
68 à copier/coller
247 des membres
2580 sur le web
>> Tous les scripts

LES MEMBRES :

56132 membres
8374 comptes CountUs
1541 comptes myCircle

LES FORUMS :

14 forums
39396 topics
189315 messages
>> Les forums

SONDAGE

La mini-astuce "Divers" du jour par caaptusss
Outlook express et Office recelle une option très utile : Les règles de messages. Elles vous permettent lorsque vous recevez beaucoup de messages d'un seul expéditeur, de les classer dans des dossiers prédéfinis ou que vous avez créé. Utile lorsque l'on veux s'y retrouver dans les mails ;-)
Proposer votre mini-astuce | Archives des mini-astuces

Pseudo :
Code :
	Se souvenir de moi