Example:
Live demo
Add the following code to any HTML/ASP/PHP file to display a minicalendar.
Parameters:
var my_url='http://www.yourwebsite.com/calendar/'; - base URL of your Calendar application
var my_ext='asp'; - file extension. asp for ASPRunnerPro, php for PHPRunner.
<script>
var my_url='http://www.yourwebsite.com/calendar/';
var my_ext='php';
var my_mont = new Array(13);
my_mont[1]="January";
my_mont[2]="February";
my_mont[3]="March";
my_mont[4]="April";
my_mont[5]="May";
my_mont[6]="June";
my_mont[7]="July";
my_mont[8]="August";
my_mont[9]="September";
my_mont[10]="October";
my_mont[11]="November";
my_mont[12]="December";
var my_mdays = new Array(13);
my_mdays[1]=31;
my_mdays[2]=28;
my_mdays[3]=31;
my_mdays[4]=30;
my_mdays[5]=31;
my_mdays[6]=30;
my_mdays[7]=31;
my_mdays[8]=31;
my_mdays[9]=30;
my_mdays[10]=31;
my_mdays[11]=30;
my_mdays[12]=31;
var sDate = new Date();
var nDate = new Date(sDate.getFullYear(),sDate.getMonth(),1);
var wd=nDate.getDay();
if(wd==0)
wd=7;
var mon1=sDate.getMonth();
var mon2=sDate.getMonth()+2;
var year1=sDate.getFullYear();
var year2=sDate.getFullYear();
if(mon1==0)
{
mon1=12;
year1=year1-1;
}
if(mon2==13)
{
mon2=1;
year2=year2+1;
}
</script>
<style>
a.my_link,a.my_link:visited
{
color: black;
TEXT-DECORATION: none;
}
</style>
<table cellpadding=0 cellspacing=0 border=0 width=161 style="border:1px solid blue;font-family: Verdana, Arial, Helvetica, sans serif;font-size: 11px;">
<tr>
<td colspan=8 align=center height=25 style="background-color:#E6EDF8">
<a class=my_link href="" onclick="location.href=my_url+'calmonthly_list.'+my_ext+'?mon='+mon1+'&yr='+year1;return false;" style="TEXT-DECORATION: none;"><</a>
<a class=my_link href="" onclick="window.location.href=my_url+'calmonthly_list.'+my_ext+'?mon='+(sDate.getMonth()+1)+'&yr='+sDate.getFullYear(); return false;" style="TEXT-DECORATION: none;">
<b><script>document.write(my_mont[sDate.getMonth()+1]);</script></b></a>
<b><script>document.write(sDate.getFullYear());</script></b>
<a class=my_link href="" onclick="location.href=my_url+'calmonthly_list.'+my_ext+'?mon='+mon2+'&yr='+year2;return false;" style="TEXT-DECORATION: none;">></a>
</td>
</tr>
<tr style="background-color:#D1DBE7" align=center><td></td></td><td>Mo</td><td>Tu</td><td>We</td><td>Th</td><td>Fr</td><td>Sa</td><td>Su</td></tr>
<script>
var d=1;
var c2;
var b;
var c;
var link;
for(i=1;i<=6;i++)
{
document.write("<tr>");
document.write("<td width=5 style='background-color:#D1DBE7'>");
document.write("<a class=my_link href='" + my_url + "calweekly_list."+my_ext+"?mon=" + (sDate.getMonth()+1) + "&yr=" + sDate.getFullYear() + "&days=" + ((i-1)*7+1) + "'>></a>");
document.write("</td>");
for(j=1;j<=7;j++)
{
c2="#F7F9FB";
if(j>5)
c2="#D1DBE7";
c="#cccccc";
b=1;
if(d==sDate.getDate())
{
c="#990000";
b=2;
}
if(d<=my_mdays[sDate.getMonth()+1])
{
link="<a class=my_link href='" + my_url + "caldaily_list."+my_ext+"?mon=" + (sDate.getMonth()+1) + "&yr=" + sDate.getFullYear() + "&days=" + d + "'>";
if(i==1)
{
if(j>=wd)
{
document.write("<td width=20 align=center style='border:" + b + "px solid " + c + ";background-color:" + c2 + "' height=20>");
document.write(link + d + "</a>");
d=d+1;
}
else
{
document.write("<td width=20 align=center style='border:1px solid " + c + ";background-color:#F2F2F2' height=20>");
document.write(" ");
}
}
else
{
document.write("<td width=20 align=center style='border:" + b + "px solid " + c + ";background-color:" + c2 + "' height=20>");
document.write(link + d + "</a>");
d=d+1;
}
}
else
{
document.write("<td width=20 align=center style='border:1px solid " + c + ";background-color:#F2F2F2' height=20>");
document.write(" ");
}
if(j==7 && 7+(i-1)*7>=my_mdays[sDate.getMonth()+1])
{
i=10;
j=10;
}
document.write("</td>");
}
document.write("</tr>");
}
</script>
<tr><td colspan=8 align=center style="font-family: Verdana, Arial, Helvetica, sans serif;font-size: 9px;background-color:#E6EDF8;">Today is
<script>
document.write(my_mont[sDate.getMonth()+1]);
document.write(" ");
document.write(sDate.getDate());
document.write(", ");
document.write(sDate.getFullYear());
</script>
</td></tr>
</table>