When i started my first project as programmer , i was told to put a calendar at the sidebar of the webpage.At that time, one of my friend help me with the code.This time I googled it and found one very simple and good sample of creating a calendar using JavaScript.I hope this will be helpful to others also .
There are few simple steps for creating a calendar
Step 1:
Insert the following codes into the HEAD section of your webpage:
<style type="text/css"> .main { width:200px; border:1px solid black; } .month { background-color:black; font:bold 12px verdana; color:white; } .daysofweek { background-color:gray; font:bold 12px verdana; color:white; } .days { font-size: 12px; font-family:verdana; color:black; background-color: lightyellow; padding: 2px; } .days #today{ font-weight: bold; color: red; } </style> <script type="text/javascript" src="basiccalendar.js"> /*********************************************** * Basic Calendar-By Brian Gosselin at http://scriptasylum.com/bgaudiodr/ * Script featured on Dynamic Drive (http://www.dynamicdrive.com) * This notice must stay intact for use * Visit http://www.dynamicdrive.com/ for full source code ***********************************************/ </script>
Step 2:
Download basiccalendar.js (by right clicking, and selecting “Save As”), and upload to your webpage directory.
Step 3:
Finally, insert the below script where you wish the calendar to appear on your page:
<script type="text/javascript"> var todaydate=new Date() var curmonth=todaydate.getMonth()+1 //get current month (1-12) var curyear=todaydate.getFullYear() //get current year document.write(buildCal(curmonth ,curyear, "main", "month", "daysofweek", "days", 1)); </script>
Click here to see an DEMO
Name required
April 12, 2011
doesn’t work on IE9 or Firefox