JavaScript implements calendar effects _javascript tips with festivals and lunar calendars

Source: Internet
Author: User

Scripts with festivals and lunar calendar:

Copy Code code as follows:



<html>


<head>


<meta http-equiv= "Content-type" content= "text/html; charset=gb2312 ">


<TITLE> calendars with lunar calendar </TITLE>


<script language= "JavaScript" >


<!--


var lunarinfo=new Array (


0X04BD8,0X04AE0,0X0A570,0X054D5,0X0D260,0X0D950,0X16554,0X056A0,0X09AD0,0X055D2,


0x04ae0,0x0a5b6,0x0a4d0,0x0d250,0x1d255,0x0b540,0x0d6a0,0x0ada2,0x095b0,0x14977,


0x04970,0x0a4b0,0x0b4b5,0x06a50,0x06d40,0x1ab54,0x02b60,0x09570,0x052f2,0x04970,


0x06566,0x0d4a0,0x0ea50,0x06e95,0x05ad0,0x02b60,0x186e3,0x092e0,0x1c8d7,0x0c950,


0x0d4a0,0x1d8a6,0x0b550,0x056a0,0x1a5b4,0x025d0,0x092d0,0x0d2b2,0x0a950,0x0b557,


0X06CA0,0X0B550,0X15355,0X04DA0,0X0A5D0,0X14573,0X052D0,0X0A9A8,0X0E950,0X06AA0,


0X0AEA6,0X0AB50,0X04B60,0X0AAE4,0X0A570,0X05260,0X0F263,0X0D950,0X05B57,0X056A0,


0X096D0,0X04DD5,0X04AD0,0X0A4D0,0X0D4D4,0X0D250,0X0D558,0X0B540,0X0B5A0,0X195A6,


0x095b0,0x049b0,0x0a974,0x0a4b0,0x0b27a,0x06a50,0x06d40,0x0af46,0x0ab60,0x09570,


0X04AF5,0X04970,0X064B0,0X074A3,0X0EA50,0X06B58,0X055C0,0X0AB60,0X096D5,0X092E0,


0X0C960,0X0D954,0X0D4A0,0X0DA50,0X07552,0X056A0,0X0ABB7,0X025D0,0X092D0,0X0CAB5,


0x0a950,0x0b4a0,0x0baa4,0x0ad50,0x055d9,0x04ba0,0x0a5b0,0x15176,0x052b0,0x0a930,


0x07954,0x06aa0,0x0ad50,0x05b52,0x04b60,0x0a6e6,0x0a4e0,0x0d260,0x0ea65,0x0d530,


0X05AA0,0X076A3,0X096D0,0X04BD7,0X04AD0,0X0A4D0,0X1D0B6,0X0D250,0X0D520,0X0DD45,


0X0B5A0,0X056D0,0X055B2,0X049B0,0X0A577,0X0A4B0,0X0AA50,0X1B255,0X06D20,0X0ADA0)





var solarmonth=new Array (31,28,31,30,31,30,31,31,30,31,30,31);


var animals=new Array ("Rat", "ox", "Tiger", "Rabbit", "dragon", "Snake", "horse", "sheep", "monkey", "Chicken", "dog", "pig");


var solarterm = new Array ("Xiaohan", "Dahan", "Spring", "rainwater," insects "," vernal Equinox "," Qingming "," Rain "," Summer "," Xiaoman "," grain "," Summer solstice "," slight heat "," Great Heat "," beginning of Autumn "," Chushu "," Lu "," Autumnal Equinox " "," Dew "," Frost "," Winter "," Snow "," Snow "," Winter Solstice ");


var sterminfo = new Array ( 0,21208,42467,63836,85337,107014,128867,150921,173149,195551,218072,240693,263343,285989,308563,331033,353350,375494,3974 47,419210,440795,462224,483532,504758);


var nStr1 = new Array (' Day ', ' one ', ' two ', ' three ', ' four ', ' five ', ' six ', ' seven ', ' eight ', ' nine ', ' ten ');


var nStr2 = new Array (' early ', ' ten ', ' 20 ', ' 30 ');


Gregorian Festival


var SFTV = new Array (


"0101 New Year's Day",


"0214 Valentine's Day",


"0308 Women's Day",


"0312 Arbor Day",


"0315 Consumer Rights Day",


"0401 April Fools ' Day",


"0501 Labor Day",


"0504 Youth Festival",


"0512 Nurse's Day",


"0601 Children's Day",


"0701 Party",


"0801 army",


"0910 teachers ' Day",


"0928 Confucius ' Birthday",


"1001 National Day",


"1006 old people's Day",


"1024 United Nations Day",


"1224 Christmas Eve",


"1225 Christmas")


Lunar Festival


var lftv = new Array (


"0101 Spring Festival",


"0115 Lantern Festival",


"0505 Dragon Boat Festival",


"7,077 Valentine's Day",


"0715 Zhongyuanjie",


"0815 Mid-Autumn Festival",


"0909 Double Ninth Festival",


"1208 Laba Festival",


"1224")


Returns the total number of days of the lunar year Y


function Lyeardays (y) {


var i, sum = 348;


For (i=0x8000 i>0x8; i>>=1) sum+= (lunarinfo[y-1900]&i)? 1:0;


Return (Sum+leapdays (y));


}


Returns the number of days of the lunar calendar Y-year leap month


function Leapdays (y) {


if (Leapmonth (y)) return ((lunarinfo[y-1900] & 0x10000)? 30:29);


else return (0);


}


The month of the lunar calendar that determines y year is the leap, not the leap. return 0


function Leapmonth (y) {


return (LUNARINFO[Y-1900]&0XF);


}


Returns the total number of days of the lunar calendar y year m months


function Monthdays (y,m) {


Return ((lunarinfo[y-1900]& (0x10000>>m))? 30:29);


}


Calculate the date of the first day of the current month and the first day of the lunar calendar one months under the current lunar date


function Dianaday (objdate) {


var i, leap=0, temp=0;


var basedate = new Date (1900,0,31);


var offset = (objdate-basedate)/86400000;


this.daycyl = offset+40;


this.moncyl = 14;


For (i=1900 i<2050 && offset>0; i++) {


temp = lyeardays (i)


offset = temp;


This.moncyl + 12;


}


if (offset<0) {


Offset + temp;


i--;


This.moncyl-= 12;


}


This.year = i;


this.yearcyl=i-1864;


Leap = Leapmonth (i); Which month does the leap


This.isleap = false;


For (I=1 i<13 && offset>0; i++) {


if (leap>0 && i== (leap+1) && this.isleap==false) {//Leap month


I.; This.isleap = true; temp = Leapdays (this.year);}


else{


temp = monthdays (this.year, i);}


if (this.isleap==true && i== (leap+1)) This.isleap = false; Lift Leap Month


offset = temp;


if (This.isleap = = false) this.moncyl++;


}


if (offset==0 && leap>0 && i==leap+1)


if (this.isleap) {this.isleap = false;}


else{this.isleap=true;--i;--this.moncyl;}


if (offset<0) {offset+=temp;--i;--this.moncyl;}


This.month=i;


this.day=offset+1;


}


Returns the number of days of the Gregorian y year m+1 month


function Solardays (y,m) {


if (m==1)


Return ((y%4==0) && (y%100!=0) | | (y%400==0))? 29:28);


Else


Return (Solarmonth[m]);


}


Record dates for Gregorian and lunar calendar days


function Calelement (syear,smonth,sday,week,lyear,lmonth,lday,isleap) {


This.istoday = false;


Calendar


This.syear = Syear;


This.smonth = Smonth;


This.sday = Sday;


This.week = week;


Lunar


This.lyear = Lyear;


This.lmonth = Lmonth;


This.lday = Lday;


This.isleap = Isleap;


Holiday record


This.lunarfestival = '; Lunar Festival


This.solarfestival = '; Gregorian Festival


This.solarterms = '; Throttle


}


Returns the nth solar term for a certain year (starting from 0 Xiaohan)


function Sterm (y,n) {


var offdate = new Date (31556925974.7* (y-1900) +sterminfo[n]*60000) +DATE.UTC (1900,0,6,2,5));


Return (Offdate.getutcdate ())


}


Save information about Y-year m+1 months


var fat=mat=9;


var eve=0;


function Calendar (y,m) {


fat=mat=0;


var sdobj,ldobj,ly,lm,ld=1,ll,lx=0,tmp1,tmp2;


var ldpos = new Array (3);


var n = 0;


var firstlm = 0;


Sdobj = new Date (y,m,1); Date of the first day of the month


This.length = Solardays (y,m); Gregorian month days


This.firstweek = Sdobj.getday (); Gregorian Calendar Month 1st week


if ((m+1) ==5) {Fat=sdobj.getday ()}


if ((m+1) ==6) {Mat=sdobj.getday ()}


for (Var i=0;i<this.length;i++) {


if (LD>LX) {


Sdobj = new Date (y,m,i+1); Date of the first day of the month


ldobj = new Dianaday (sdobj); Lunar


LY = Ldobj.year; Agriculture calendar year


LM = Ldobj.month; Lunar month


LD = Ldobj.day; Lunar Day


LL = Ldobj.isleap; Lunar Calendar whether the leap month


LX = LL? Leapdays (LY): Monthdays (LY,LM); The last day of lunar calendar month


if (lm==12) {EVE=LX}


if (n==0) FIRSTLM = LM;


ldpos[n++] = i-ld+1;


}


This[i] = new Calelement (y,m+1,i+1,nstr1[(I+this.firstweek)%7],ly,lm,ld++,ll);


if ((I+this.firstweek)%7==0) {


This[i].color = ' red '; Sunday Colors


}


}


Throttle


Tmp1=sterm (y,m*2)-1;


Tmp2=sterm (y,m*2+1)-1;


This[tmp1].solarterms = solarterm[m*2];


This[tmp2].solarterms = solarterm[m*2+1];


if ((this.firstweek+12)%7==5)//Black Friday


This[12].solarfestival = ' Black Friday ';


if (y==ty && m==tm) This[td-1].istoday = true; Today


}


Display the date of the lunar calendar in Chinese


function Cday (d) {


var s;


Switch (d) {


Case 10:


s = ' decade '; Break


Case 20:


s = ' 20 '; Break


Break


Case 30:


s = ' 30 '; Break


Break


Default:


s = Nstr2[math.floor (D/10)];


s + + nstr1[d%10];


}


return (s);


}


var cld;


function Drawcld (SY,SM) {


var tf=true;


var p1=p2= "";


var i,sd,s,size;


CLD = new Calendar (SY,SM);


gz.innerhtml = ' "' +animals[(SY-4)%12]+ '"; Zodiac


for (i=0;i<42;i++) {


Sobj=eval (' SD ' + i);


Lobj=eval (' LD ' + i);


Sobj.classname = ';


SD = I-cld.firstweek;


if (sd>-1 && sd<cld.length) {//Date


sobj.innerhtml = sd+1;


if (cld[sd].istoday) {sObj.style.color = ' #9900FF ';}//Today Color


Else{sobj.style.color = ';}


if (cld[sd].lday==1) {//Show lunar month


lobj.innerhtml = ' <b> ' + (cld[sd].isleap? Leap ': ' + cld[sd].lmonth + ' month ' + (Monthdays (cld[sd].lyear,cld[sd].lmonth) ==29? ' Small ': ' big ') + ' </b> ';


}


else{lobj.innerhtml = Cday (cld[sd].lday);} Show Lunar Day


var slfw=ssfw=null;


S=cld[sd].solarfestival;


for (Var ipp=0;ipp<lftv.length;ipp++) {//Lunar festival


if (parseint (Lftv[ipp].substr (0,2)) = = (Cld[sd].lmonth)) {


if (parseint (LFTV[IPP].SUBSTR (2,4)) = = (Cld[sd].lday)) {


LOBJ.INNERHTML=LFTV[IPP].SUBSTR (5);


SLFW=LFTV[IPP].SUBSTR (5);


}


}


if (12== (Cld[sd].lmonth)) {//Judge whether it is New Year's Eve


if (eve== (Cld[sd].lday)) {lobj.innerhtml= "New Year's Eve"; Slfw= "New Year's Eve";}


}


}


for (Var ipp=0;ipp<sftv.length;ipp++) {//Gregorian calendar Festival


if (parseint (Sftv[ipp].substr (0,2)) = = (sm+1)) {


if (parseint (SFTV[IPP].SUBSTR (2,4)) = = (sd+1)) {


LOBJ.INNERHTML=SFTV[IPP].SUBSTR (5);


SSFW=SFTV[IPP].SUBSTR (5);


}


}


}


if ((sm+1) ==5) {//Mother's Day


if (fat==0) {


if ((sd+1) ==7) {ssfw= "Mother's Day"; lobj.innerhtml= "Mother's Day"}


}


else if (fat<9) {


if ((sd+1) = = ((7-fat) +8)) {ssfw= "Mother's Day"; lobj.innerhtml= "Mother's Day"}


}


}


if ((sm+1) ==6) {//Father's Day


if (mat==0) {


if ((sd+1) ==14) {ssfw= "Father's Day"; Lobj.innerhtml= "Father's Day"}


}


else if (mat<9) {


if ((sd+1) = = ((7-mat) +15)) {ssfw= "Father's Day"; Lobj.innerhtml= "Father's Day"}


}


}


if (s.length<=0) {//Set the color of the throttle


s=cld[sd].solarterms;


if (s.length>0) s = S.fontcolor (' Limegreen ');


}


if (s.length>0) {lobj.innerhtml=s;    Slfw=s;} Throttle


if ((slfw!=null) && (ssfw!=null)) {


lobj.innerhtml=slfw+ "/" +SSFW;


}


}


else {//non date


sobj.innerhtml = ';


lobj.innerhtml = ';


}


}


}


When you select a year in the Drop-down list, call the Custom function DRAWCLD () to display information about the Gregorian and lunar calendar


function Changecld () {


var y,m;


Y=CLD. sy.selectedindex+1900;


M=CLD. Sm.selectedindex;


DRAWCLD (Y,M);


}


Save the date of the current system with a custom variable


var today = new Date ();


var TY = Today.getfullyear ();


var TM = Today.getmonth ();


var TD = Today.getdate ();


When you open the page, display the current year in the Drop-down list and call the Custom function DRAWCLD () to display information about the Gregorian and lunar calendar


function initial () {


CLD. sy.selectedindex=ty-1900;


CLD. Sm.selectedindex=tm;


DRAWCLD (TY,TM);


}


-->


</SCRIPT>


<body onload=initial () >


<CENTER>


<form name=cld>


<TABLE>


<TR>


<TD align=middle>


<table border=1 cellpadding= "0" cellspacing= "0" bordercolordark= "#FFFFFF" bordercolor= "#ffffff" bordercolorlight= "#EEEEEE" >


<tr bgcolor= "#006600" >


<TD colspan=7><font color= #ffffff style= "font-size:9pt" > Gregorian calendar


<select name=sy onchange=changecld () style= "font-size:9pt" >


<script language= "JavaScript" >


for (i=1900;i<2050;i++) document.write (' <option> ' +i);


</SCRIPT>


</SELECT> year <select name=sm onchange=changecld () style= "font-size:9pt" >


<script language= "JavaScript" >


for (i=1;i<13;i++) document.write (' <option> ' +i);


</SCRIPT>


</SELECT> month </FONT> <font color= #ffffff face= song body id=gz style= "font-size:12pt" ></font><br ></TD>


</TR>


<TR align=middle bgcolor= #e0e0e0 >


<TD width=54 style= "FONT-SIZE:9PT; padding:5pt; " > Day </TD>


<TD width=54 style= "font-size:9pt" > </TD>


<TD width=54 style= "font-size:9pt" > Two </TD>


<TD width=54 style= "font-size:9pt" > Three </TD>


<TD width=54 style= "font-size:9pt" > Four </TD>


<TD width=54 style= "font-size:9pt" > Five </TD>


<TD width=54 style= "font-size:9pt" > Six </TD></TR>


<script language= "JavaScript" >


var gnum;


for (i=0;i<6;i++) {


document.write (' <tr align=center> ');


for (j=0;j<7;j++) {


Gnum = I*7+j;


document.write (' <td id= ' GD ' + gnum + ' "><font id=" SD ' + gnum + ' "size=2 face=" Arial Black ");


if (j = = 0) document.write (' color=red ');


if (j = = 6) document.write (' color= #000080 ');


document.write (' title= "" > </font><br><font id= "LD ' + gnum + '" size=2 style= "font-size:9pt" > </ Font></td> ');


}


document.write (' </tr> ');


}


</SCRIPT>


</TABLE>


</TD>


</TR>


</TABLE>


</FORM>


</CENTER>


</BODY>


</HTML>


Very rare, with festivals and solar terms as well as the calendar special effects, I hope that the small friends can enjoy

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.