Calendrier en javascript


un calendrier 

<!DOCTYPE html>
 <html>
 <head>
 <title>calendrier</title>

<style type="text/css">

body {
background-color:#9d5f66;
}

#contcalendar{

width:230px;
margin:auto;
margin-top:100px;
background-color:#904044;
-webkit-box-shadow: 10px 10px 10px #212121;
 filter:progid:DXImageTransform.Microsoft.Shadow(color=#333333,direction=120,strength=5);
box-shadow: 10px 10px 10px #212121;
border:1px ridge #aaa;
border-radius:10px;
}

#contcalendar table{

margin:auto;
text-align:center;
font-size:12px;
font-weight:bold;
line-height:20px;
text-shadow: 10px 10px 10px #232711;
 filter:progid:DXImageTransform.Microsoft.Shadow(color=#333333,direction=120,strength=7);		  
 
}
</style>
<script>

function calendar() {

	var monthNames= ['Jan','Fev','Mar','Avr','Mai','Jui','Juil','Aou','Sep','Oct','Nov','Dec'];
	var jours= ['Lun','Mar','Mer','Jeu','Ven','Sam','Dim'];
	var monthDays= [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
	var today= new Date();
	var thisDay= today.getDate();
	var year= today.getYear();
	year <= 200 ? year += 1900 : null;

	if (((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0)){
		monthDays[1] = 29;
	}
	var nDays= monthDays[today.getMonth()];
	var firstDay= today;
	firstDay.setDate(0);

	firstDay.getDate() == 2 ? firstDay.setDate(0) : null;
	
	var startDay = firstDay.getDay();
	
	var tb= document.createElement('table');
	
	var tbr= tb.insertRow(-1);

	var tbh= document.createElement("th");
	tbh.setAttribute('colspan','7');
	var tbhtxt= document.createTextNode(monthNames[today.getMonth()+1]+'.'+year);
	tbh.appendChild(tbhtxt);

	tbr.appendChild(tbh);

	var tbr=tb.insertRow(-1);

	for(var i=0 ;i<jours.length ; i++){

		tbr.insertCell(-1).appendChild(document.createTextNode(jours[i]));
	}

	var tbr= document.createElement("tr");

	var column= 0;

	for (var i= 0; i < startDay; i++) {
		tbr.insertCell(0);
		column++;
	}

	for (var i = 1; i <= nDays; i++) {
	
		var tdd= tbr.insertCell(-1);

		i == thisDay ? tdd.style.color="#FF0000" : null;

		tdd.appendChild(document.createTextNode(i));

		column++;
		if (column == 7) {
			tb.appendChild(tbr);
			var tbr=document.createElement("tr");
			column = 0;
		}

		i == nDays ? tb.appendChild(tbr) : null;

	}
	document.getElementById('contcalendar').appendChild(tb);
}

typeof window.addEventListener == 'undefined' ? window.attachEvent("onload",calendar) : addEventListener('load',calendar,false);
</script>
</head>

<body>
<div id='contcalendar'></div>
</body>
</html>

A voir également

Publié par zertyx.
Ce document intitulé «  Calendrier en javascript  » issu de CodeS-SourceS (https://codes-sources.commentcamarche.net/) est mis à disposition sous les termes de la licence Creative Commons. Vous pouvez copier, modifier des copies de cette page, dans les conditions fixées par la licence, tant que cette note apparaît clairement.
Ajouter un commentaire

Commentaires

Commenter la réponse de nickadele
Enigma, cryptage des message en javascript
Affichage aleatoire d'une image et rafraichissement automatique javascript et jquery