CodeS-SourceS est hébergé par Frontier.fr

Ce site au démarrage

begin process at 2012 02 12 00:32:49

Accueil Codes Tutoriels Forum Livres Emploi Services Connexion

Trouver un code source :

dans

[ Dernières recherches ]

Accueil >

CALENDRIER

Information sur la source

Note :

9,67 / 10

Catégorie :Divers Niveau :Débutant Date de création :16/05/2002 Date de mise à jour :16/05/2002 04:08:12 Vu :44 673

Auteur : bob3000

Ecrire un message privé

Site perso

Ce membre participe au partage de revenus publicitaires

Commentaire sur cette source (11)

Ajouter un commentaire et/ou une note

Description

Voici un calendrier...

Source

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
var dDate = new Date();
var dCurMonth = dDate.getMonth();
var dCurDayOfMonth = dDate.getDate();
var dCurYear = dDate.getFullYear();
var objPrevElement = new Object();
function fToggleColor(myElement) {
var toggleColor = "#ff0000";
if (myElement.id == "calDateText") {
if (myElement.color == toggleColor) {
myElement.color = "";
} else {
myElement.color = toggleColor;
}
} else if (myElement.id == "calCell") {
for (var i in myElement.children) {
if (myElement.children[i].id == "calDateText") {
if (myElement.children[i].color == toggleColor) {
myElement.children[i].color = "";
} else {
myElement.children[i].color = toggleColor;
}
}
}
}
}
function fSetSelectedDay(myElement){
if (myElement.id == "calCell") {
if (!isNaN(parseInt(myElement.children["calDateText"].innerText))) {
myElement.bgColor = "#c0c0c0";
objPrevElement.bgColor = "";
document.all.calSelectedDate.value = parseInt(myElement.children["calDateText"].innerText);
objPrevElement = myElement;
}
}
}
function fGetDaysInMonth(iMonth, iYear) {
var dPrevDate = new Date(iYear, iMonth, 0);
return dPrevDate.getDate();
}
function fBuildCal(iYear, iMonth, iDayStyle) {
var aMonth = new Array();
aMonth[0] = new Array(7);
aMonth[1] = new Array(7);
aMonth[2] = new Array(7);
aMonth[3] = new Array(7);
aMonth[4] = new Array(7);
aMonth[5] = new Array(7);
aMonth[6] = new Array(7);
var dCalDate = new Date(iYear, iMonth-1, 1);
var iDayOfFirst = dCalDate.getDay();
var iDaysInMonth = fGetDaysInMonth(iMonth, iYear);
var iVarDate = 1;
var i, d, w;
if (iDayStyle == 2) {
aMonth[0][0] = "Dimanche";
aMonth[0][1] = "Lundi";
aMonth[0][2] = "Mardi";
aMonth[0][3] = "Mercredi";
aMonth[0][4] = "Jeudi";
aMonth[0][5] = "Vendredi";
aMonth[0][6] = "Samedi";
} else if (iDayStyle == 1) {
aMonth[0][0] = "Dim";
aMonth[0][1] = "Lun";
aMonth[0][2] = "Mar";
aMonth[0][3] = "Mer";
aMonth[0][4] = "Jeu";
aMonth[0][5] = "Ven";
aMonth[0][6] = "Sam";
} else {
aMonth[0][0] = "Di";
aMonth[0][1] = "Lu";
aMonth[0][2] = "Ma";
aMonth[0][3] = "Me";
aMonth[0][4] = "Je";
aMonth[0][5] = "Ve";
aMonth[0][6] = "Sa";
}
for (d = iDayOfFirst; d < 7; d++) {
aMonth[1][d] = iVarDate;
iVarDate++;
}
for (w = 2; w < 7; w++) {
for (d = 0; d < 7; d++) {
if (iVarDate <= iDaysInMonth) {
aMonth[w][d] = iVarDate;
iVarDate++;
}
}
}
return aMonth;
}
function fDrawCal(iYear, iMonth, iCellWidth, iCellHeight, sDateTextSize, sDateTextWeight, iDayStyle) {
var myMonth;
myMonth = fBuildCal(iYear, iMonth, iDayStyle);
document.write("<table border='1'>")
document.write("<tr>");
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][0] + "</td>");
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][1] + "</td>");
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][2] + "</td>");
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][3] + "</td>");
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][4] + "</td>");
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][5] + "</td>");
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][6] + "</td>");
document.write("</tr>");
for (w = 1; w < 7; w++) {
document.write("<tr>")
for (d = 0; d < 7; d++) {
document.write("<td align='left' valign='top' width='" + iCellWidth + "' height='" + iCellHeight + "' id=calCell style='CURSOR:Hand' onMouseOver='fToggleColor(this)' onMouseOut='fToggleColor(this)' onclick=fSetSelectedDay(this)>");
if (!isNaN(myMonth[w][d])) {
document.write("<font id=calDateText onMouseOver='fToggleColor(this)' style='CURSOR:Hand;FONT-FAMILY:Arial;FONT-SIZE:" + sDateTextSize + ";FONT-WEIGHT:" + sDateTextWeight + "' onMouseOut='fToggleColor(this)' onclick=fSetSelectedDay(this)>" + myMonth[w][d] + "</font>");
} else {
document.write("<font id=calDateText onMouseOver='fToggleColor(this)' style='CURSOR:Hand;FONT-FAMILY:Arial;FONT-SIZE:" + sDateTextSize + ";FONT-WEIGHT:" + sDateTextWeight + "' onMouseOut='fToggleColor(this)' onclick=fSetSelectedDay(this)> </font>");
}
document.write("</td>")
}
document.write("</tr>");
}
document.write("</table>")
}
function fUpdateCal(iYear, iMonth) {
myMonth = fBuildCal(iYear, iMonth);
objPrevElement.bgColor = "";
document.all.calSelectedDate.value = "";
for (w = 1; w < 7; w++) {
for (d = 0; d < 7; d++) {
if (!isNaN(myMonth[w][d])) {
calDateText[((7*w)+d)-7].innerText = myMonth[w][d];
} else {
calDateText[((7*w)+d)-7].innerText = " ";
}
}
}
}
</script>
</HEAD>
<BODY>
<script language="JavaScript" for=window event=onload>
var dCurDate = new Date();
frmCalendarSample.tbSelMonth.options[dCurDate.getMonth()].selected = true;
for (i = 0; i < frmCalendarSample.tbSelYear.length; i++)
if (frmCalendarSample.tbSelYear.options[i].value == dCurDate.getFullYear())
frmCalendarSample.tbSelYear.options[i].selected = true;
</script>
<form name="frmCalendarSample" method="post" action="">
<input type="hidden" name="calSelectedDate" value="">
<table border="1">
<tr>
<td>
<select name="tbSelMonth" onchange='fUpdateCal(frmCalendarSample.tbSelYear.value, frmCalendarSample.tbSelMonth.value)'>
<option value="1">Janvier</option>
<option value="2">Février</option>
<option value="3">Mars</option>
<option value="4">Avril</option>
<option value="5">Mai</option>
<option value="6">Juin</option>
<option value="7">Juillet</option>
<option value="8">Aout</option>
<option value="9">Septembre</option>
<option value="10">Octobre</option>
<option value="11">Novembre</option>
<option value="12">Décembre</option>
</select>
<select name="tbSelYear" onchange='fUpdateCal(frmCalendarSample.tbSelYear.value, frmCalendarSample.tbSelMonth.value)'>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
</select>
</td>
</tr>
<tr>
<td>
<script language="JavaScript">
var dCurDate = new Date();
fDrawCal(dCurDate.getFullYear(), dCurDate.getMonth()+1, 30, 30, "12px", "bold", 1);
</script>
</td>
</tr>
</table>
</form>

<HTML> 
<HEAD> 
<SCRIPT LANGUAGE="JavaScript"> 
var dDate = new Date(); 
var dCurMonth = dDate.getMonth(); 
var dCurDayOfMonth = dDate.getDate(); 
var dCurYear = dDate.getFullYear(); 
var objPrevElement = new Object(); 

function fToggleColor(myElement) { 
var toggleColor = "#ff0000"; 
if (myElement.id == "calDateText") { 
if (myElement.color == toggleColor) { 
myElement.color = ""; 
} else { 
myElement.color = toggleColor; 
  } 
} else if (myElement.id == "calCell") { 
for (var i in myElement.children) { 
if (myElement.children[i].id == "calDateText") { 
if (myElement.children[i].color == toggleColor) { 
myElement.children[i].color = ""; 
} else { 
myElement.children[i].color = toggleColor; 
           } 
        } 
     } 
  } 
} 
function fSetSelectedDay(myElement){ 
if (myElement.id == "calCell") { 
if (!isNaN(parseInt(myElement.children["calDateText"].innerText))) { 
myElement.bgColor = "#c0c0c0"; 
objPrevElement.bgColor = ""; 
document.all.calSelectedDate.value = parseInt(myElement.children["calDateText"].innerText); 
objPrevElement = myElement; 
     } 
  } 
} 
function fGetDaysInMonth(iMonth, iYear) { 
var dPrevDate = new Date(iYear, iMonth, 0); 
return dPrevDate.getDate(); 
} 
function fBuildCal(iYear, iMonth, iDayStyle) { 
var aMonth = new Array(); 
aMonth[0] = new Array(7); 
aMonth[1] = new Array(7); 
aMonth[2] = new Array(7); 
aMonth[3] = new Array(7); 
aMonth[4] = new Array(7); 
aMonth[5] = new Array(7); 
aMonth[6] = new Array(7); 
var dCalDate = new Date(iYear, iMonth-1, 1); 
var iDayOfFirst = dCalDate.getDay(); 
var iDaysInMonth = fGetDaysInMonth(iMonth, iYear); 
var iVarDate = 1; 
var i, d, w; 
if (iDayStyle == 2) { 
aMonth[0][0] = "Dimanche"; 
aMonth[0][1] = "Lundi"; 
aMonth[0][2] = "Mardi"; 
aMonth[0][3] = "Mercredi"; 
aMonth[0][4] = "Jeudi"; 
aMonth[0][5] = "Vendredi"; 
aMonth[0][6] = "Samedi"; 
} else if (iDayStyle == 1) { 
aMonth[0][0] = "Dim"; 
aMonth[0][1] = "Lun"; 
aMonth[0][2] = "Mar"; 
aMonth[0][3] = "Mer"; 
aMonth[0][4] = "Jeu"; 
aMonth[0][5] = "Ven"; 
aMonth[0][6] = "Sam"; 
} else { 
aMonth[0][0] = "Di"; 
aMonth[0][1] = "Lu"; 
aMonth[0][2] = "Ma"; 
aMonth[0][3] = "Me"; 
aMonth[0][4] = "Je"; 
aMonth[0][5] = "Ve"; 
aMonth[0][6] = "Sa"; 
} 
for (d = iDayOfFirst; d < 7; d++) { 
aMonth[1][d] = iVarDate; 
iVarDate++; 
} 
for (w = 2; w < 7; w++) { 
for (d = 0; d < 7; d++) { 
if (iVarDate <= iDaysInMonth) { 
aMonth[w][d] = iVarDate; 
iVarDate++; 
     } 
  } 
} 
return aMonth; 
} 
function fDrawCal(iYear, iMonth, iCellWidth, iCellHeight, sDateTextSize, sDateTextWeight, iDayStyle) { 
var myMonth; 
myMonth = fBuildCal(iYear, iMonth, iDayStyle); 
document.write("<table border='1'>") 
document.write("<tr>"); 
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][0] + "</td>"); 
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][1] + "</td>"); 
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][2] + "</td>"); 
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][3] + "</td>"); 
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][4] + "</td>"); 
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][5] + "</td>"); 
document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][6] + "</td>"); 
document.write("</tr>"); 
for (w = 1; w < 7; w++) { 
document.write("<tr>") 
for (d = 0; d < 7; d++) { 
document.write("<td align='left' valign='top' width='" + iCellWidth + "' height='" + iCellHeight + "' id=calCell style='CURSOR:Hand' onMouseOver='fToggleColor(this)' onMouseOut='fToggleColor(this)' onclick=fSetSelectedDay(this)>"); 
if (!isNaN(myMonth[w][d])) { 
document.write("<font id=calDateText onMouseOver='fToggleColor(this)' style='CURSOR:Hand;FONT-FAMILY:Arial;FONT-SIZE:" + sDateTextSize + ";FONT-WEIGHT:" + sDateTextWeight + "' onMouseOut='fToggleColor(this)' onclick=fSetSelectedDay(this)>" + myMonth[w][d] + "</font>"); 
} else { 
document.write("<font id=calDateText onMouseOver='fToggleColor(this)' style='CURSOR:Hand;FONT-FAMILY:Arial;FONT-SIZE:" + sDateTextSize + ";FONT-WEIGHT:" + sDateTextWeight + "' onMouseOut='fToggleColor(this)' onclick=fSetSelectedDay(this)> </font>"); 
} 
document.write("</td>") 
} 
document.write("</tr>"); 
} 
document.write("</table>") 
} 
function fUpdateCal(iYear, iMonth) { 
myMonth = fBuildCal(iYear, iMonth); 
objPrevElement.bgColor = ""; 
document.all.calSelectedDate.value = ""; 
for (w = 1; w < 7; w++) { 
for (d = 0; d < 7; d++) { 
if (!isNaN(myMonth[w][d])) { 
calDateText[((7*w)+d)-7].innerText = myMonth[w][d]; 
} else { 
calDateText[((7*w)+d)-7].innerText = " "; 
        } 
     } 
  } 
} 
</script> 
</HEAD> 
<BODY> 
<script language="JavaScript" for=window event=onload> 
var dCurDate = new Date(); 
frmCalendarSample.tbSelMonth.options[dCurDate.getMonth()].selected = true; 
for (i = 0; i < frmCalendarSample.tbSelYear.length; i++) 
if (frmCalendarSample.tbSelYear.options[i].value == dCurDate.getFullYear()) 
frmCalendarSample.tbSelYear.options[i].selected = true;
</script> 

<form name="frmCalendarSample" method="post" action=""> 
<input type="hidden" name="calSelectedDate" value=""> 

<table border="1"> 
<tr> 
<td> 
<select name="tbSelMonth" onchange='fUpdateCal(frmCalendarSample.tbSelYear.value, frmCalendarSample.tbSelMonth.value)'> 
<option value="1">Janvier</option> 
<option value="2">Février</option> 
<option value="3">Mars</option> 
<option value="4">Avril</option> 
<option value="5">Mai</option> 
<option value="6">Juin</option> 
<option value="7">Juillet</option> 
<option value="8">Aout</option> 
<option value="9">Septembre</option> 
<option value="10">Octobre</option> 
<option value="11">Novembre</option> 
<option value="12">Décembre</option> 
</select> 

<select name="tbSelYear" onchange='fUpdateCal(frmCalendarSample.tbSelYear.value, frmCalendarSample.tbSelMonth.value)'> 
<option value="1998">1998</option> 
<option value="1999">1999</option> 
<option value="2000">2000</option> 
<option value="2001">2001</option> 
<option value="2002">2002</option> 
<option value="2003">2003</option> 
<option value="2004">2004</option> 
</select> 
</td> 
</tr> 
<tr> 
<td> 
<script language="JavaScript"> 
var dCurDate = new Date(); 
fDrawCal(dCurDate.getFullYear(), dCurDate.getMonth()+1, 30, 30, "12px", "bold", 1); 
</script> 
</td> 
</tr> 
</table> 
</form>

Conclusion

Merci d'avance pour vos commentaires et m'avertir s'il y a des bugs

bob3000

Sources du même auteur

POPUP SPECIAL(MODAL - MODELESS DIALOG)

EFFET DE CHARGEMENT

INFOS SUR LES UTILISATEURS

FACON LA PLUS FACILE AU MONDE D'ECRIRE LA DATE

COULEUR DE FOND ALEATOIRE + TITRE ALEATOIRE *UPDATED*

Toutes les sources de bob3000

Sources de la même categorie

COLONNES ADAPTABLES EN HAUTEUR par dronoide

VECTEURS ET MATRICES: OUTILS GRAPHIQUES UTILES par william voirol

HTML5 PLAYER par kazma

SCROLLBAR PERSONNALISABLE par kazma

INFO BULLE par RudiRatlos

Toutes les sources de la catégorie Divers

Commentaires et avis

Commentaire de yoman64 le 04/06/2002 17:59:19

Utile mais...Tu na pas oublier de dire qui est-ce qui a fait ce code huh???

Vive moi

Commentaire de bob3000 le 09/08/2002 20:28:27

non mais, t'es vraiment un imbecile toi!

Commentaire de DolfinCry le 07/10/2002 15:27:50

C'est pas fort de copier un code qui existe deja. Au moins, marque le nom du gars qui la fait.

Perso, tant qu'a voir du monde comme toi se venter de faire de quoi pis que c'est meme pas vrai, aussi ben arreter

Commentaire de DolfinCry le 07/10/2002 15:29:14

t'aurais pus te forcer a mettre des commentaire au moins, je suis sur que tu sais meme pas quoi ta marquer

Commentaire de eax le 29/04/2004 16:06:41

ben pas mal comme script,
euh je vais l'utiliser sur un site à moi (avec qq modifs lol), je dois mettre quoi comme nom dans les remerciments?

Commentaire de eax le 29/04/2004 16:31:50

j'aimerais savoir si c possible de rajouter un bouton pour revenir directement à la date du jour?

Commentaire de bob3000 le 30/04/2004 20:43:10

eax - merci!!! met rien dans les remerciments, pas besoin.

je comprend pas ce que tu veux dire? tu veux mettre un bouton pour afficher la date présente? comme au load de la page? un boutton reset de la date?

Commentaire de bob3000 le 30/04/2004 20:45:17

Commentaire de eax le 02/05/2004 22:09:50

oui quand qq s'amuse à changer le mois, il faudrait un bouton pour sélectionner le jour et le mois courant

Commentaire de stephboz le 21/07/2004 13:59:48

un petit bug kan on clique 3 fois sur la meme cellule bin ca drevrai :
- sélectionner
- déselectionner
- sélectionner
mais je dernier évènement ne se produit jamais !
sinon sympas le reste

Commentaire de tesniced le 15/02/2011 10:23:21 9/10

Pour le'année tu pourrai faire une boucle avec +5 ans par rapport a la date actuel

Ajouter un commentaire

Nos sponsors

Derniers Blogs

SESSION SILVERLIGHT 5 3D : SLIDES ET DEMOS par Groc

[TECHDAYS 2012] SESSION WEBMATRIX 2 : LE COUTEAU SUISSE GRATUIT POUR VOS DéVELOPPEMENTS WEB - SLIDES par gpommier

[SHAREPOINT] LES SESSIONS TECHDAYS 2012. par Patrick Guimonet

TECHDAYS PARIS 2012 : SESSION PLEINIèRE JOUR 3 par ROMELARD Fabrice

MISHRA READER : UN LECTEUR RSS TRèS ZUNE STYLE EN OPEN SOURCE ! par Vko

Forum

RE : RéCUPéRER LA VALEUR D'UNE VARIABLE PHP POUR L'UTILISER EN JAVASCRIPT par stealone

RE : TRANSFARMATION DES VARIABLES par marlopremier

RE : ADAPTER UN SCRIPT POUR IE6 par Ewan83

ADAPTER UN SCRIPT POUR IE6 par Ewan83

RE : CREATION DE SCORING OU RATING par Alex16000

Côté IT

Offres d'emploi

Formations Video

Appels d'offres

Passerelle Pericles sur site Joomla 17
Budget : 499€
Infogerance Serveur Debian Linux
Budget : 2 400€
Developpeur applications iphone - ipad - android
Budget : 800€

Logiciels

Tribler (2012)
TRIBLER (2012)

Tribler est un client pair à pair (P2P/Peer-to-Peer) open source avec la capacité de regarder des...

Cliquez pour télécharger Tribler
OneSwarm (2012)
ONESWARM (2012)

Le peer-to-peer qui protège votre vie privée, c'est OneSwarm. Ce logiciel de peer-to-peer crypté...

Cliquez pour télécharger OneSwarm
PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V8.4)
PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V8.4)

PONAMEDIA TV DEVIENS HELLLOOO FLASH LA TV SUR VOTRE ORDINATEUR. Toute une plateforme Multi...

Cliquez pour télécharger PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO
Academy System (17.2.1.0)
ACADEMY SYSTEM (17.2.1.0)

Logiciel de gestion des établissements. - élèves/étudiants (inscription, dossier, absence...) -...

Cliquez pour télécharger Academy System
Easy-Planning (1.0.0.1)
EASY-PLANNING (1.0.0.1)

Basé sur les mêmes principes que MyPlanning, Easy-Planning permet de créer des plannings sous la ...

Cliquez pour télécharger Easy-Planning