A compatible IE, Firefox and Opera browser English script calendar

Posted by john

1/14/2007

Related Tags:
css effects firefox

<html>
<head>
<SCRIPT Language="javascript">
<! --
Var fixedX = -1 / / x Position (-1 if to appear below control)
Var fixedY = -1 / / y position (-1 if to appear below control)
Var startAt = 1 / / 0 - sunday; 1 - monday
Var showWeekNumber = 0 / / 0 - don't show; 1 - show
Var showToday = 0 / / 0 - don't show; 1 - show
/ / Var imgDir = "pic / calendar /" / / directory for images ... eg var imgDir = "/ img /"
Var imgDir = "../../ Inc / image / "

Var gotoString = "Go To Current Month"
Var todayString = "Today is"
Var weekString = "Wk"
Var scrollLeftMessage = "Click to scroll to previous month. Hold mouse button to scroll automatically."
Var scrollRightMessage = "Click to scroll to next month. Hold mouse button to scroll automatically."
Var selectMonthMessage = "Click to select a month."
Var selectYearMessage = "Click to select a year."
Var selectDateMessage = "Select [date] as date." / / Do not replace [date], it will be replaced by date.

Var crossobj, crossMonthObj, crossYearObj, monthSelected, yearSelected, dateSelected, omonthSelected, oyearSelected, odateSelected, monthConstructed, yearConstructed, intervalID1, intervalID2, timeoutID1, timeoutID2, ctlToPlaceValue, ctlNow, dateFormat, nStartingYear, nStartingMonth

Var bPageLoaded = false

Var ie = false;
Var dom = document.getElementById

Var ns4 = document.layers
Var today = new Date ()
Var dateNow = today.getDate ()
Var monthNow = today.getMonth ()
Var yearNow = today.getYear ()
Var imgsrc = new Array ( "drop1.gif", "drop2.gif", "left1.gif", "left2.gif", "right1.gif", "right2.gif")
Var img = new Array ()

Var bShow = false;

If ((navigator.userAgent.toLowerCase (). IndexOf ( "opera") == -1) & & (navigator.userAgent.toLowerCase (). IndexOf ( "msie")! = -1))
(
Ie = true;
)

/ * Hides <select> and <applet> objects (for IE only) * /
Function hideElement (elmID, overDiv)
(
If (ie)
(
For (i = 0; i <document.all.tags (elmID). Length; i)
(
Obj = document.all.tags (elmID) [i];
If (! Obj | |! Obj.offsetParent)
(
Continue;
)

/ / Find the element's offsetTop and offsetLeft relative to the body tag.
ObjLeft = obj.offsetLeft;
ObjTop = obj.offsetTop;
ObjParent = obj.offsetParent;

While (objParent.tagName.toUpperCase ()! = "BODY")
(
ObjLeft = objParent.offsetLeft;
ObjTop = objParent.offsetTop;
ObjParent = objParent.offsetParent;
)

ObjHeight = obj.offsetHeight;
ObjWidth = obj.offsetWidth;

If ((overDiv.offsetLeft overDiv.offsetWidth) <= objLeft);
Else if ((overDiv.offsetTop overDiv.offsetHeight) <= objTop);
Else if (overDiv.offsetTop> = (objTop objHeight));
Else if (overDiv.offsetLeft> = (objLeft objWidth));
Else
(
Obj.style.visibility = "hidden";
)
)
)
)

/ *
* Unhides <select> and <applet> objects (for IE only)
* /
Function showElement (elmID)
(
If (ie)
(
For (i = 0; i <document.all.tags (elmID). Length; i)
(
Obj = document.all.tags (elmID) [i];

If (! Obj | |! Obj.offsetParent)
(
Continue;
)

Obj.style.visibility = "";
)
)
)

Function HolidayRec (d, m, y, desc)
(
This.d = d
This.m = m
This.y = y
This.desc desc =
)

Var HolidaysCounter = 0
Var Holidays = new Array ()

Function addHoliday (d, m, y, desc)
(
Holidays [HolidaysCounter] = new HolidayRec (d, m, y, desc)
)

If (dom)
(
For (i = 0; i <imgsrc.length; i)
(
Img [i] = new Image
Img [i]. ImgDir imgsrc = src [i]
)
Document.write ( "<div onclick='bShow=true' id='calendar' style='z-index: 999;position:absolute;visibility:hidden;'> <table Width =" ((showWeekNumber == 1) ? 250:220) "style = 'font-family: arial; font-size: 11px; border-width: 1; border-style: solid; border-color: # a0a0a0; font-family: arial; font-size: 11px) 'bgcolor =' # ffffff '> <tr bgcolor='#0000aa'> <td> <table width='" ((showWeekNumber==1)?248:218) "'> <tr> <td style = 'padding: 2px; font-family: arial; font-size: 11px;'> <font color='#ffffff'> <B> <span id='caption'> </ span> </ B> </ Font > </ td> <td align=right> <a href='javascript:hideCalendar()'> <IMG SRC = ' "imgDir" close.gif' WIDTH ='15 'HEIGHT ='13' Border ='0 ' ALT = 'Close the Calendar'> </ a> </ td> </ tr> </ table> </ td> </ tr> <tr> <td style='padding:5px' bgcolor=#ffffff> < span id = 'content'> </ span> </ td> </ tr> ")

If (showToday == 1)
(
Document.write ( "<tr bgcolor=#f0f0f0> <td style='padding:5px' align=center> <span id='lblToday'> </ span> </ td> </ tr>")
)

Document.write ( "</ table> </ div> <div id='selectMonth' style='z-index: 999;position:absolute;visibility:hidden;'> </ div> <div id = 'selectYear' style = 'z-index: 999; position: absolute; visibility: hidden ;'></ div> ");
)

Var monthName = new Array ( "01" and "02" and "03" and "04" and "05" and "06" and "07" and "08" and "09" and "10", "11", "12")
Var monthName2 = new Array ( "01" and "02" and "03" and "04" and "05" and "06" and "07" and "08" and "09" and "10", "11", "12")
If (startAt == 0)
(
DayName = new Array ( "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat")
)
Else
(
DayName = new Array ( "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun")
)
Var styleAnchor = "text-decoration: none; color: black;"
Var styleLightBorder = "border-style: solid; border-width: 1px; border-color: # a0a0a0;"

Function swapImage (srcImg, destImg)
(
If (ie)
(
Document.getElementById (srcImg). SetAttribute ( "src" imgDir destImg)
)
)

Function init ()
(
If (! Ns4)
(
If (! Ie)
(
YearNow = 1900
)

Crossobj = (dom)? Document.getElementById ( "calendar"). Style: ie? Document.all.calendar: document.calendar
HideCalendar ()

CrossMonthObj = (dom)? Document.getElementById ( "selectMonth"). Style: ie? Document.all.selectMonth: document.selectMonth

CrossYearObj = (dom)? Document.getElementById ( "selectYear"). Style: ie? Document.all.selectYear: document.selectYear

MonthConstructed = false;
YearConstructed = false;

If (showToday == 1)
(
Document.getElementById ( "lblToday"). TodayString innerHTML = "<a onmousemove = 'window.status = \" "gotoString" \ "' onmouseout = 'window.status = \" \ "' title = '" gotoString "' style = ' "styleAnchor"' href = 'javascript: monthSelected = monthNow; yearSelected = yearNow; constructCalendar ();'>" dayName [(today.getDay ()-startAt ==- 1)? 6: (today.getDay () - startAt)], "" dateNow "" monthName [monthNow]. substring (0,3) "" yearNow "</ a>"
)

SHTML1 = "<span id = 'spanLeft' style = 'border-style: solid; border-width: 1; border-color: # 3366FF; cursor: pointer' onmouseover = 'swapImage (\" changeLeft \ ", \" left2 . gif \ "); this.style.borderColor = \" # 88AAFF \ "window.status = \" "scrollLeftMessage" \ " 'onclick =' javascript: decMonth () 'onmouseout =' clearInterval (intervalID1); swapImage ( \ "changeLeft \", \ "left1.gif \"); this.style.borderColor = \ "# 3366FF \" window.status = \ "\" 'onmousedown =' clearTimeout (timeoutID1); timeoutID1 = setTimeout (\ "StartDecMonth () \", 500) 'onmouseup =' clearTimeout (timeoutID1); clearInterval (intervalID1) '> <IMG id =' changeLeft 'SRC =' "imgDir" left1.gif 'width = 10 Height = 11 = BORDER 0> </ span> "
SHTML1 = "<span id = 'spanRight' style = 'border-style: solid; border-width: 1; border-color: # 3366FF; cursor: pointer' onmouseover = 'swapImage (\" changeRight \ ", \" right2 . gif \ "); this.style.borderColor = \" # 88AAFF \ "window.status = \" "scrollRightMessage" \ " 'onmouseout =' clearInterval (intervalID1); swapImage (\" changeRight \ ", \" right1 . gif \ "); this.style.borderColor = \" # 3366FF \ "window.status = \" \ " 'onclick =' incMonth () 'onmousedown =' clearTimeout (timeoutID1); timeoutID1 = setTimeout (\" StartIncMonth () \ ", 500) 'onmouseup =' clearTimeout (timeoutID1); clearInterval (intervalID1) '> <IMG id='changeRight' SRC='" imgDir "right1.gif' width=10 height=11 BORDER=0> </ span> "
SHTML1 = "<span id = 'spanMonth' style = 'border-style: solid; border-width: 1; border-color: # 3366FF; cursor: pointer' onmouseover = 'swapImage (\" changeMonth \ ", \" drop2 . gif \ "); this.style.borderColor = \" # 88AAFF \ "window.status = \" "selectMonthMessage" \ " 'onmouseout =' swapImage (\" changeMonth \ ", \" drop1.gif \ ") ; this.style.borderColor = \ "# 3366FF \" window.status = \ "\" 'onclick =' popUpMonth ()'></ span> "
SHTML1 = "<span id = 'spanYear' style = 'border-style: solid; border-width: 1; border-color: # 3366FF; cursor: pointer' onmouseover = 'swapImage (\" changeYear \ ", \" drop2 . gif \ "); this.style.borderColor = \" # 88AAFF \ "window.status = \" "selectYearMessage" \ " 'onmouseout =' swapImage (\" changeYear \ ", \" drop1.gif \ ") ; this.style.borderColor = \ "# 3366FF \" window.status = \ "\" 'onclick =' popUpYear ()'></ span> "

Document.getElementById ( "caption"). InnerHTML = sHTML1

BPageLoaded = true
)
)

Function hideCalendar ()
(
Crossobj.visibility = "hidden"
If (crossMonthObj! = Null)
(
CrossMonthObj.visibility = "hidden"
)
If (crossYearObj! = Null)
(
CrossYearObj.visibility = "hidden"
)

ShowElement ( 'SELECT');
ShowElement ( 'APPLET');
)

Function padZero (num)
(
Return (num <10)?'0 'Num: num;
)

Function constructDate (d, m, y)
(
STmp = dateFormat
STmp = sTmp.replace ( "dd", "<e>")
STmp = sTmp.replace ( "d", "<d>")
STmp = sTmp.replace ( "<e>" padZero (d))
STmp = sTmp.replace ( "<d>", d)
STmp = sTmp.replace ( "mmmm", "<p>")
STmp = sTmp.replace ( "mmm," "<o>")
STmp = sTmp.replace ( "mm", "<n>")
STmp = sTmp.replace ( "m", "<m>")
STmp = sTmp.replace ( "<m>" m 1)
STmp = sTmp.replace ( "<n>" padZero (m 1))
STmp = sTmp.replace ( "<o>" monthName [m])
STmp = sTmp.replace ( "<p>" monthName2 [m])
STmp = sTmp.replace ( "yyyy", y)
Return sTmp.replace ( "yy", padZero (y 0))
)

Function closeCalendar ()
(
Var sTmp

HideCalendar ();
CtlToPlaceValue.value = constructDate (dateSelected, monthSelected, yearSelected)
)

/ *** *** Month Pulldown /

Function StartDecMonth ()
(
IntervalID1 = setInterval ( "decMonth ()", 80)
)

Function StartIncMonth ()
(
IntervalID1 = setInterval ( "incMonth ()", 80)
)

Function incMonth ()
(
MonthSelected
If (monthSelected> 11)
(
MonthSelected = 0
YearSelected
)
ConstructCalendar ()
)

Function decMonth ()
(
MonthSelected --
If (monthSelected <0)
(
MonthSelected = 11
YearSelected --
)
ConstructCalendar ()
)

Function upMonth ()
(
If (nStartingMonth> 0)
(
NStartingMonth -;
For (i = 0; i <6; i)
(
NewMonth = (i nStartingMonth);
If (newMonth == monthSelected)
TxtMonth = "<B>" monthName [newMonth] "</ B>";
Else
TxtMonth = "" monthName [newMonth] "";
Document.getElementById ( "m" i). InnerHTML = txtMonth;
)
)
BShow = true
)

Function downMonth ()
(
If (nStartingMonth <6)
(
NStartingMonth;
For (i = 0; i <6; i)
(
NewMonth = (i nStartingMonth);
If (newMonth == monthSelected)
TxtMonth = "<B>" monthName [newMonth] "</ B>";
Else
TxtMonth = "" monthName [newMonth] "";
Document.getElementById ( "m" i). InnerHTML = txtMonth;
)
)
BShow = true
)

Function selectMonth (nMonth)
(
MonthSelected = parseInt (nMonth nStartingMonth);
MonthConstructed = false;
ConstructCalendar ();
PopDownMonth ();
)

Function constructMonth ()
(
PopDownYear ()
If (! MonthConstructed)
(

SHTML = "<tr> <td align = 'center' onmouseover = 'this.style.backgroundColor = \" # FFCC99 \ "' onmouseout = 'clearInterval (intervalID1); this.style.backgroundColor = \" \ "' style = 'cursor: pointer' onmousedown = 'clearInterval (intervalID1); intervalID1 = setInterval (\ "upMonth () \", 30)' onmouseup = 'clearInterval (intervalID1 )'>-</ td> </ tr> "

J = 0;
I = (monthSelected-3);
If (i <0)
I = 0;
If (i> 6)
I = 6;
NStartingMonth = i;
For (ii = 0; ii <6; ii, i, j)
(
MonthName sName = [i];
If (i == monthSelected)
(
SName = "<B>" sName "</ B>"
)
SHTML = "<tr> <td id = 'm" j "' onmouseover = 'this.style.backgroundColor = \" # FFCC99 \ "' onmouseout = 'this.style.backgroundColor = \" \ "' style = 'cursor : pointer 'onclick =' selectMonth ( "j"); event.cancelBubble = true '> "sName" </ td> </ tr> "
)

SHTML = "<tr> <td align = 'center' onmouseover = 'this.style.backgroundColor = \" # FFCC99 \ "' onmouseout = 'clearInterval (intervalID2); this.style.backgroundColor = \" \ "' style = 'cursor: pointer' onmousedown = 'clearInterval (intervalID2); intervalID2 = setInterval (\ "downMonth () \", 30)' onmouseup = 'clearInterval (intervalID2)'> </ td> </ tr> "

Document.getElementById ( "selectMonth"). InnerHTML = "<table width = 32 style = 'font-family: arial; font-size: 11px; border-width: 1; border-style: solid; border-color: # a0a0a0 ; 'bgcolor =' # FFFFDD 'cellspacing = 0 onmouseover =' clearTimeout (timeoutID1) 'onmouseout =' clearTimeout (timeoutID1); timeoutID1 = setTimeout (\ "popDownMonth () \", 100); event.cancelBubble = true '> " sHTML "</ table>"

MonthConstructed = true
)
)
Function popUpMonth ()
(
ConstructMonth ()
CrossMonthObj.visibility = (dom | | ie)? "Visible": "show"
CrossMonthObj.left = parseInt (crossobj.left) 50
CrossMonthObj.top = parseInt (crossobj.top) 26

HideElement ( 'SELECT', document.getElementById ( "selectMonth"));
HideElement ( 'APPLET' document.getElementById ( "selectMonth"));
)

Function popDownMonth ()
(
CrossMonthObj.visibility = "hidden"
)

/ *** *** Year Pulldown /

Function incYear ()
(
For (i = 0; i <6; i)
(
NewYear = (i nStartingYear) 1
If (newYear == yearSelected)
(
TxtYear = "<B>" newYear "</ B>"
)
Else
(
TxtYear = "" newYear ""
)
Document.getElementById ( "y" i). InnerHTML = txtYear
)
NStartingYear;
BShow = true
)

Function decYear ()
(
For (i = 0; i <6; i)
(
NewYear = (i nStartingYear) -1
If (newYear == yearSelected)
(
TxtYear = "<B>" newYear "</ B>"
)
Else
(
TxtYear = "" newYear ""
)
Document.getElementById ( "y" i). InnerHTML = txtYear
)
NStartingYear -;
BShow = true
)

Function selectYear (nYear)
(
YearSelected = parseInt (nYear nStartingYear);
YearConstructed = false;
ConstructCalendar ();
PopDownYear ();
)

Function constructYear ()
(
PopDownMonth ()
SHTML = ""
If (! YearConstructed)
(

SHTML = "<tr> <td align = 'center' onmouseover = 'this.style.backgroundColor = \" # FFCC99 \ "' onmouseout = 'clearInterval (intervalID1); this.style.backgroundColor = \" \ "' style = 'cursor: pointer' onmousedown = 'clearInterval (intervalID1); intervalID1 = setInterval (\ "decYear () \", 30)' onmouseup = 'clearInterval (intervalID1 )'>-</ td> </ tr> "

J = 0
NStartingYear = yearSelected-3
For (i = (yearSelected-3); i <(yearSelected 3); i)
(
SName = i;
If (i == yearSelected)
(
SName = "<B>" sName "</ B>"
)

SHTML = "<tr> <td id = 'y" j "' onmouseover = 'this.style.backgroundColor = \" # FFCC99 \ "' onmouseout = 'this.style.backgroundColor = \" \ "' style = 'cursor : pointer 'onclick =' selectYear ( "j"); event.cancelBubble = true '> "sName" </ td> </ tr> "
J;
)

SHTML = "<tr> <td align = 'center' onmouseover = 'this.style.backgroundColor = \" # FFCC99 \ "' onmouseout = 'clearInterval (intervalID2); this.style.backgroundColor = \" \ "' style = 'cursor: pointer' onmousedown = 'clearInterval (intervalID2); intervalID2 = setInterval (\ "incYear () \", 30)' onmouseup = 'clearInterval (intervalID2)'> </ td> </ tr> "

Document.getElementById ( "selectYear"). InnerHTML = "<table width = 44 style = 'font-family: arial; font-size: 11px; border-width: 1; border-style: solid; border-color: # a0a0a0 ; 'bgcolor =' # FFFFDD 'onmouseover =' clearTimeout (timeoutID2) 'onmouseout =' clearTimeout (timeoutID2); timeoutID2 = setTimeout (\ "popDownYear () \", 100) 'cellspacing = 0> "sHTML" </ table> "

YearConstructed = true
)
)

Function popDownYear ()
(
ClearInterval (intervalID1)
ClearTimeout (timeoutID1)
ClearInterval (intervalID2)
ClearTimeout (timeoutID2)
CrossYearObj.visibility = "hidden"
)

Function popUpYear ()
(
Var leftOffset

ConstructYear ()
CrossYearObj.visibility = (dom | | ie)? "Visible": "show"
LeftOffset = parseInt (crossobj.left) document.getElementById ( "spanYear"). OffsetLeft
If (ie)
(
LeftOffset = 6
)
CrossYearObj.left = leftOffset
CrossYearObj.top = parseInt (crossobj.top) 26
)

/ *** *** Calendar /
Function WeekNbr (n)
(
/ / Algorithm used:
/ / From Klaus Tondering's Calendar document (The Authority / Guru)
/ / Hhtp: / / www.tondering.dk / claus / calendar.html
/ / A = (14-month) / 12
/ / Y = year 4800 - a
/ / M = month 12a - 3
/ / J = day (153m 2) / 5365 y y / 4 - y / y 100 / 400 - 32045
/ / D4 = (J 31741 - (J mod 7)) mod 146097 mod 36524 mod 1461
/ / L = d4 / 1460
/ / D1 = ((d4 - L) mod 365) L
/ / WeekNumber = d1 / 7 1

N.getFullYear year = ();
N.getMonth month = () 1;
If (startAt == 0)
(
N.getDate day = () 1;
)
Else
(
N.getDate day = ();
)

A = Math.floor ((14-month) / 12);
Y = year 4800 - a;
M = 12 * a month - 3;
B = Math.floor (y / 4) - Math.floor (y/100) Math.floor (y/400);
J = day Math.floor ((153 * m 2) / 5) 365 * yb - 32045;
D4 = (((J 31741 - (J% 7))% 146097)% 36524)% 1461;
L = Math.floor (d4 / 1460);
D1 = ((d4 - L)% 365) L;
Week = Math.floor (d1 / 7) 1;

Return week;
)

Function constructCalendar ()
(
Var aNumDays = Array (31,0,31,30,31,30,31,31,30,31,30,31)

Var dateMessage
Var startDate = new Date (yearSelected, monthSelected, 1)
Var endDate

If (monthSelected == 1)
(
EndDate = new Date (yearSelected, monthSelected 1,1);
EndDate = new Date (endDate - (24 * 60 * 60 * 1000));
EndDate.getDate numDaysInMonth = ()
)
Else
(
ANumDays numDaysInMonth = [monthSelected];
)

DatePointer = 0
DayPointer = startDate.getDay () - startAt

If (dayPointer <0)
(
DayPointer = 6
)

SHTML = "<table border=0 style='font-family:verdana;font-size:10px;'> <tr>"

If (showWeekNumber == 1)
(
SHTML = "<td width=27> <b>" weekString "</ b> </ td> <td width=1 rowspan=7 bgcolor='#d0d0d0' style='padding:0px'> <img src = ' "imgDir" divider.gif 'width = 1> </ td> "
)

For (i = 0; i <7; i)
(
SHTML = "<td width='27' align='right'> <B>" dayName [i] "</ B> </ td>"
)
SHTML = "</ tr> <tr>"

If (showWeekNumber == 1)
(
SHTML = "<td align=right>" WeekNbr (startDate) "</ td>"
)

For (var i = 1; i <= dayPointer; i)
(
SHTML = "<td> </ td>"
)

For (datePointer = 1; datePointer <= numDaysInMonth; datePointer)
(
DayPointer;
SHTML = "<td align=right>"
SStyle = styleAnchor
If ((datePointer == odateSelected) & & (monthSelected == omonthSelected) & & (yearSelected == oyearSelected))
StyleLightBorder sStyle = ()

SHint = ""
For (k = 0; k <HolidaysCounter; k)
(
If ((parseInt (Holidays [k]. D) == datePointer) & & (parseInt (Holidays [k]. M) == (monthSelected 1)))
(
If ((parseInt (Holidays [k]. Y) == 0 )||(( parseInt (Holidays [k]. Y) == yearSelected) & & (parseInt (Holidays [k]. Y)! = 0)))
(
SStyle = "background-color: # FFDDDD;"
SHint sHint ==""? Holidays = [k]. Desc: "\ n" Holidays [k]. Desc
)
)
)

Var regexp = / \ "/ g
SHint = sHint.replace (regexp ,""")

DateMessage = "onmousemove = 'window.status = \" "selectDateMessage.replace (" [date] ", constructDate (datePointer, monthSelected, yearSelected))" \ "' onmouseout = 'window.status = \" \ "'"

If ((datePointer == dateNow) & & (monthSelected == monthNow) & & (yearSelected == yearNow))
(
SHTML = "<b> <a" dateMessage "title=\"" sHint "\" style='" sStyle "'href='javascript:dateSelected=" datePointer ";closeCalendar();'> <font Color = # ff0000 > "datePointer" </ font> </ a> </ b> "
)
Else if (dayPointer% 7 == (startAt * -1) 1)
(
SHTML = "<a" dateMessage "title=\"" sHint "\" style='" sStyle "'href='javascript:dateSelected=" datePointer ";closeCalendar();'> <font color=#909090> "datePointer" </ font> </ a> "
)
Else
(
SHTML = "<a" dateMessage "title=\"" sHint "\" style='" sStyle "'href='javascript:dateSelected=" datePointer ";closeCalendar();'>" datePointer "</ a> "
)

SHTML = ""
If ((dayPointer startAt) == startAt% 7)
(
SHTML = "</ tr> <tr>"
If ((showWeekNumber == 1) & (datePointer <numDaysInMonth))
(
SHTML = "<td align=right>" (WeekNbr (new Date (yearSelected, monthSelected, datePointer 1))) "</ td>"
)
)
)

Document.getElementById ( "content"). InnerHTML = sHTML
Document.getElementById ( "spanMonth"). InnerHTML = "" monthName [monthSelected] "<IMG id = 'changeMonth' SRC = '" imgDir "drop1.gif' WIDTH ='12 'HEIGHT ='10' BORDER = 0> "
Document.getElementById ( "spanYear"). InnerHTML = "" yearSelected "<IMG id='changeYear' SRC='" imgDir "drop1.gif' WIDTH='12' HEIGHT='10' BORDER=0> "
)

Function popUpCalendar (ctl, ctl2, format)
(
Var leftpos = 0
Var toppos = 0

If (bPageLoaded)
(
If (crossobj.visibility == "hidden")
(
CtlToPlaceValue = ctl2
DateFormat = format;

FormatChar = ""
AFormat = dateFormat.split (formatChar)
If (aFormat.length <3)
(
FormatChar = "/"
AFormat = dateFormat.split (formatChar)
If (aFormat.length <3)
(
FormatChar = "."
AFormat = dateFormat.split (formatChar)
If (aFormat.length <3)
(
FormatChar = "-"
AFormat = dateFormat.split (formatChar)
If (aFormat.length <3)
(
/ / Invalid date format
FormatChar = ""
)
)
)
)

TokensChanged = 0
If (formatChar! = "")
(
/ / Use user's date
AData = ctl2.value.split (formatChar)

For (i = 0; i <3; i)
(
If ((aFormat [i] == "d") | | (aFormat [i] == "dd"))
(
DateSelected = parseInt (aData [i], 10)
TokensChanged
)
Else if ((aFormat [i] == "m") | | (aFormat [i] == "mm"))
(
MonthSelected = parseInt (aData [i], 10) - 1
TokensChanged
)
Else if (aFormat [i] == "yyyy")
(
YearSelected = parseInt (aData [i], 10)
TokensChanged
)
Else if (aFormat [i] == "mmm")
(
For (j = 0; j <12; j)
(
If (aData [i] [j] == monthName)
(
MonthSelected = j
TokensChanged
)
)
)
Else if (aFormat [i] == "mmmm")
(
For (j = 0; j <12; j)
(
If (aData [i] [j] == monthName2)
(
MonthSelected = j
TokensChanged
)
)
)
)
)

OdateSelected = dateSelected
OmonthSelected = monthSelected
OyearSelected = yearSelected

ATag = ctl
Do
(
ATag = aTag.offsetParent;
Leftpos = aTag.offsetLeft;
Toppos = aTag.offsetTop;
) While (aTag.tagName! = "BODY");

Crossobj.left = fixedX ==- 1? Ctl.offsetLeft leftpos: fixedX
Crossobj.top = fixedY ==- 1? Ctl.offsetTop toppos ctl.offsetHeight 2: fixedY
ConstructCalendar (1, monthSelected, yearSelected);
Crossobj.visibility = (dom | | ie)? "Visible": "show"

HideElement ( 'SELECT', document.getElementById ( "calendar"));
HideElement ( 'APPLET' document.getElementById ( "calendar"));

BShow = true;
)
Else
(
HideCalendar ()
If (ctlNow! = Ctl) (popUpCalendar (ctl, ctl2, format))
)
CtlNow = ctl
)
)

Document.onkeypress = function hidecal1 ()
(
If (event.keyCode == 27)
(
HideCalendar ()
)
)
Document.onclick = function hidecal2 ()
(
If (! BShow)
(
HideCalendar ()
)
BShow = false
)

If (ie)
(
Init ()
)
Else
(
Window.onload = init
)
//-->
</ SCRIPT>
</ Head>
<body>
<table> <tr> <td> <INPUT id = "Text1" onclick = 'popUpCalendar (this, this, "mm / dd / yyyy")' readOnly type = "text"
size = "11" name = "Text1"> </ td> </ tr> </ table>
</ Body>
</ Html>

Description: close.gif, drop1.gif, drop2.gif, left1.gif, left2.gif, right1.gif, right2.gif were closed Photo (14 * 13), the down arrow 1 (11 * 10), the down arrow 2 (11 * 10), a left arrow (10 * 11), the left arrow 2 (10 * 11), a right arrow (10 * 11), the right arrow 2 ( 10 * 11)

HTML Tutorial - multi-window page (Frames)

Frames use structural design of HTML documents, the window can be divided into several small windows, each window can be printed in the different documents, happily, each window is the communication between each other. Sometimes used in the right, I feel really good. ...

Guide to HTML primary form table

Walk the World Wide Web world, the number of forms used to the layout HTML pages, but also was being abused. We will CSS Senior tutorial to learn how not form layout pages. The correct form should be useful to display tabular data. There are many labels...

AJAX development download and install ATF steps

Need tools components: 1, Sun Java JDK 1.5.0 (or higher) 2, Tomcat 5 or more 3, download wtp-all-in-one-sdk-R-1.5.3-win32.zip (WTP) Http://download.actuatechina.com/eclipse/webtools/downloads/drops/R1.5/R-1.5.3-200702082048/wtp-all-in-o...

Make good use of hyperlinks marker - A

Hyperlink <a> representative of a link labeled, in English anchor (Anchor) initials. Its role is the current location of the text or picture connected to other pages, text or image, which is well known, but on its grammatical structure may be a bit unknown, and its use must...

"Crumbs" (Breadcrumbs) site structure

In fairy tales, "Handzel and Geleiteer", and when Handzel Geleiteer through the forest, they are places along the route taken by the crumbs are cast, these crumbs to help them to find Road home. Although this is only a children's fairy tale, but it contains a vari...

CSS and DIV Web Page Design

Categories

Tags Cloud

Links

Popular Articles

A compatible IE, Firefox and Opera browser English script calendar