Calendar by Anup Khandelwal | JavaScriptSource

Calendar by Anup Khandelwal

Anup Khandelwal May 22, 2012


If you need a simple, elegant calendar to display the current days of the month, Basic Calendar is an excellent script for the purpose. Uses CSS to allow easy changing to its appearance, everything from calendar dimensions, colors, down to the font used to highlight the current day.


he above references an external .js file. Download basiccalendar.js (by right clicking, and selecting "Save As"), and upload to your webpage directory. Within the above code, you may customize the CSS rules to change all visual aspects of the calendar. Step 2: Finally, insert the below script where you wish the calendar to appear on your page:

Code Snippet

<style type="text/css">

.main {
border:1px solid black;

.month {
font:bold 12px verdana;

.daysofweek {
font:bold 12px verdana;

.days {
font-size: 12px;
background-color: lightyellow;
padding: 2px;

.days #today{
font-weight: bold;
color: red;


<script type="text/javascript" src="basiccalendar.js">

* Basic Calendar-By Brian Gosselin at
* Script featured on Dynamic Drive (
* This notice must stay intact for use
* Visit for full source code


Leave a Response

(1 comment)

this calendar is good

delton Nov 21, 2016