USA Calendar Javascript

Javascripts > Javascript Calendars > USA Calendar

Script Title: USA Calendar

Description: It shows a Calendar of the month. Today is highlited. The two colors, that are used for highliting and background, can by changed in the STYLE statement. This version is for America and UK where the week starts at Sunday. The calendar is writen in English. This can be changed by changing the first two arrays.

Example: Available

Credit: Script created by Alex de Kruijff

Copy the following code into your <HEAD></HEAD> tags.

<STYLE> BODY { background-color: #F0F0FF; scrollbar-face-color: #D0D0FF; } BODY.menu1 { background-color: #E0E0FF } .highlite { background-color: #FFE0FF } .highground { background-color: #FFF0FF } TD { vertical-align: top; } </STYLE> <SCRIPT LANGUAGE="Javascript"> weekArr=new Array("Su", "Mo", "Tu", "We", "Th", "Vr", "Sa") monthArr=new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December") now=new Date() clockImg = new Array(10); function startClock() { for (i = 0; i <= 9; i++) { clockImg[i] = new Image(); clockImg[i].src = ""+i+".gif"; } setTimeout("virtualClock()", 60); } function virtualClock() { /* Original by Tim Van Goethem, tim@uophetnet.com * Changed by Alex de Kruijff, akruijff@dds.nl at 1 september 2002 * Reason: Fetch a the images at one to improve performance. */ nu = new Date(); hr = nu.getHours(); min = nu.getMinutes(); sec = nu.getSeconds(); document.images.hra.src = clockImg[Math.floor(hr/10)].src document.images.hrb.src = clockImg[hr%10].src document.images.mina.src = clockImg[Math.floor(min/10)].src document.images.minb.src = clockImg[min%10].src document.images.seca.src = clockImg[Math.floor(sec/10)].src document.images.secb.src = clockImg[sec%10].src setTimeout("virtualClock()", 60); } function getMaxMonthd(year, month) { var max = Date.UTC(year, month, 1, 0, 0, 0) - Date.UTC(year, month-1, 1, 0, 0, 0) max /= 24*3600000 return max; } function getYeard(year, month, day) { var daynum = Date.UTC(year, month, day, 0, 0, 0) - Date.UTC(year, 0, 1, 0, 0, 0) daynum /= 24*3600000 daynum += 1 return daynum; } function getWeekd(year, month, day) { /*** Formula of Zeller ***/ if (month <= 2) { year = year-1; month = month+12; } var e = Math.floor(year/100); var y = year%100; var a = Math.floor(2.6001*(month-2)-.2); a += Math.floor(y/4); a += Math.floor(e/4); a += day+y; a -= 2*e; a += 3; a %= 7; if (a < 0) a += 7; return a; } function getWeekEuropa(year, month, day) { /*** http://developer.irt.org/script/914.htm ***/ var newYear = new Date(year,0,1); var modDay = newYear.getDay(); if (modDay == 0) modDay=6; else modDay--; var daynum = getYeard(year, month, day); if (modDay < 4 ) weeknum = Math.floor((daynum+modDay-1)/7)+1; else { weeknum = Math.floor((daynum+modDay-1)/7); if (weeknum == 0) { year--; var prevNewYear = new Date(year,0,1); var prevmodDay = prevNewYear.getDay(); if (prevmodDay == 0) prevmodDay = 6; else prevmodDay--; if (prevmodDay < 4) weeknum = 53; else weeknum = 52; } } return weeknum; } function monthCalendar(year, month) { /*********************************************************** * Copyright (c) 2002, Alex de Kruijff * * All rights reserved. * * * * akruijff@dds.nl * * http://www.akruijff.dds.nl * * * * Redistributions of source code must retain the above * * copyright notice, the link to a full version of the * * software licence and the following disclaimer. Use of * * the software implies an agreement with the licence. * * * * http://www.akruijff.dds.nl/en/software%20licence.txt * * * * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND * * CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED * * WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED * * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A * * PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL * * THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY * * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR * * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, * * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF * * USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) * * HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER * * IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING * * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE * * USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE * * POSSIBILITY OF SUCH DAMAGE. * ***********************************************************/ document.write("<TD scope=row colspan=9 width=* class=highlite> <CENTER>"+monthArr[month]+" "+year+"</CENTER> </TD>") document.write("</TR>") document.write("<TR>") document.write("<TD colspan=2 class=highlite>Week</TD>") document.write("<TD class=highlite>"+weekArr[0]+"</TD>") document.write("<TD class=highlite>"+weekArr[1]+"</TD>") document.write("<TD class=highlite>"+weekArr[2]+"</TD>") document.write("<TD class=highlite>"+weekArr[3]+"</TD>") document.write("<TD class=highlite>"+weekArr[4]+"</TD>") document.write("<TD class=highlite>"+weekArr[5]+"</TD>") document.write("<TD class=highlite>"+weekArr[6]+"</TD>") document.write("</TR>") var day = 1; var week = getWeekEuropa(year, month, day); var max = getMaxMonthd(year, month) while(day < max) { document.write("<TR><TD colspan=2 align=right>"+week+"</TD>") week++ if (day == 1) n = getWeekd(year, month, day); else n = 0; if (n != 0) document.write("<TD colspan="+n+"></TD>"); for (i = n; i < 7; i++) { if (day > max) document.write("<TD></TD>") else if (day == now.getDate()) document.write("<TD class=highlite align=right>"+day+"</TD>") else document.write("<TD align=right>"+day+"</TD>") day++; } document.write("</TR>") } } </SCRIPT>

Copy the following code INTO your <BODY> tag.

<BODY onLoad="startClock();">

Copy the following code between the <BODY></BODY> tags of your html page.

<TABLE class=highground height=100%>  <TR><SCRIPT LANGUAGE="JavaScript"> var year = now.getYear(); if (year < 1900) year += 1900 /* above is a workaround for Opera 6.4 */ monthCalendar(year, now.getMonth()); </SCRIPT></TR>   <TR><TD class=highlite colspan=9 height=4> <CENTER> <img width=22 height=38 src="9.gif" name=hra> <img width=22 height=38 src="9.gif" name=hrb> <img width=22 height=38 src="y.gif"> <img width=22 height=38 src="9.gif" name=mina> <img width=22 height=38 src="9.gif" name=minb> <img width=22 height=38 src="y.gif"> <img width=22 height=38 src="9.gif" name=seca> <img width=22 height=38 src="9.gif" name=secb> </CENTER> </TD></TR>  </TABLE>

Enter your name and email address to have this script sent right to your Inbox for later viewing.

First Name Last Name Email

<reallybig.com>
Web Builder Network Portal

WebBuilderZone
The Largest directory of Web Building resources on the 'Net!

Reallybig Forums
Ask a question, join a discussion, start a thread.

Bignosebird
FREE CGI scripts, Web tutorials, essential HTML tricks and more!

Fontpool
1000+ Truetype fonts for PC & MAC!

Graphxkingdom
Thousands of free Icons, Clipart & Themes!

Free-Backgrounds
Hundreds of eye-popping Backgrounds & Textures

Java-scripts.net
Cool and easy effects with cut-and-paste Javascripts!

Sitecritique.net
Friendly community where you can get a site critique - or give one!

Advertise
on the
Reallybig.com
Network