Current Month Calendar Links

[Total: 0    Average: 0/5]

This shows how to create the current month calendar.

Head Code:

<style type=text/css>
.td0 {color:blue;background-color:gold;}
.td1 {color:red;background-color:blue;}
.td2 {color:green;background-color:red;}
.td3 {color:black;background-color:green;}
.td4 {color:white;background-color:black;}
.td5 {color:steelblue;background-color:white;}
.td6 {color:gold;background-color:steelblue;}
</style>

Body Code:

<script>
var MAKE_LINKS=0; // set to 1 to make href links
var _NUM_DAYS_IN_MONTH=31;
var OFFSET=3; // start month on WED (sun,mon,tue,wed,thr,fri,sat)

// link -> day_1.html, day_31.html
var _PAGE_PREFIX="/data/ex_474/day_";
var _PAGE_SUFFIX=".html";

var _out="";
_out+="<table>";
_out+="<tr>";
_out+="<td class=td0 align=center>SUN</td>";
_out+="<td class=td1 align=center>MON</td>";
_out+="<td class=td2 align=center>TUE</td>";
_out+="<td class=td3 align=center>WED</td>";
_out+="<td class=td4 align=center>THR</td>";
_out+="<td class=td5 align=center>FRI</td>";
_out+="<td class=td6 align=center>SAT</td>";
_out+="</tr>";
for(var i=1-OFFSET;i<=_NUM_DAYS_IN_MONTH-OFFSET;i+=7)
{
_out+="<tr>";
for(var j=0;j<7;j++)
{
if((j+i)<=_NUM_DAYS_IN_MONTH && (j+i)>=1)
{
  _out+="<td align=right class=td"+j+">";
  /* uncomment this next line to make it run -- here we show you how it works */
  if(MAKE_LINKS)
  {
    _out+="<a href='"+_PAGE_PREFIX+(i+j)+_PAGE_SUFFIX+"'>"+(i+j)+"</a>";
  }
  else
  {
    _out+="<a href='#'>"+(i+j)+"</a>";
  }
  _out+="</td>";
}
else if(j+i<1)_out+="<td> </td>";
}
_out+="</tr>";
}
_out+="</table>";
document.write(_out);
</script>

Times Viewed: 3

Leave a Reply

Your email address will not be published. Required fields are marked *