Donnez votre avis

Calendrier en javascript

Posez votre question

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

Enigma, cryptage des message en javascript

Affichage aleatoire d'une image et rafraichissement automatique javascript et jquery

Ajouter un commentaire

Commentaires

Afficher les 12 commentaires