Я также попробовал это и много получил. После освоения принципов реализации спецэффектов календаря JS я хочу добавить больше функций и могу играть в нее свободно. Позвольте мне сначала поделиться этим здесь. Если вам интересно, вы можете попробовать это!
В этой статье используются примеры JS для реализации календарных эффектов с лунными календарями и другой информацией. Том кода очень большой для вашей ссылки. Конкретный контент заключается в следующем
Изображение воспроизведения:
Код реализации:
<html> <Head> <Teal> Постоянный календарь </title> <meta content = "Лунный календарь; солнечный календарь; месячный календарь; фестиваль; часовой пояс; солнечный термин; восемь символов; стебли и ветви; зодиак; григорианский солнечный; китайский лунный; календар;" name = Keywords> <Meta Content = All Name = Robots> <Meta Content = "Грегорианский солнечный календарь и китайский лунный календарь" name = description> <meta charset = "utf-8"/> <style type = "text/css"> body {margin: 0px; Заполнение: 0px; } </style> </head> <body> <center> <br> <table cellpadding = "0" cellpacing = "0" id = "1"> <tr> <td> <style> #cal {ширина: 434px; Граница: 1PX SOLID #C3D9FF; размер шрифта: 12px; Полевая: 8px 0 0 15px; } #cal #top {height: 29px; высота линии: 29px; Фон: #e7eef8; Цвет: #003784; Лебь набивки: 30px; } #cal #top select {font-size: 12px; } #cal #top input {padding: 0; } #cal ul #wk {margin: 0; Заполнение: 0; Высота: 25px; } #cal ul #wk li {float: left; Ширина: 60px; Текст-альбом: Центр; высота линии: 25px; Список стиля: нет; } #cal ul #wk li b {font-weight: нормальный; Цвет: #C60B02; } #cal #cm {clear: Left; Пограничная топ: 1PX SOLID #DDD; Пограничный подъем: 1px пунктир #DDD; позиция: относительно; } #cal #cm .cell {position: Absolute; Ширина: 42px; Высота: 36px; Текст-альбом: Центр; Полевая: 0 0 0 9px; } #cal #cm .cell .so {font: bold 16px arial; } #cal #bm {text-align: right; Высота: 24px; высота линии: 24px; Подкладка: 0 13px 0 0; } #cal #bm a {color: 7977ce; } #cal #fd {display: none; позиция: абсолютно; Граница: 1px solid #ddddf; Фон: #FEFFCD; Заполнение: 10px; высота линии: 21px; Ширина: 150px; } #cal #fd b {font-weight: normal; Цвет: #C60A00; } </style> <!-[if ie]> <style> #cal #top {padding-top: 4px;} #cal #top input {width: 65px;} #cal #fd {width: 170px;} </style> <! id = "top"> Повестка дня <SELECT> </select> Год <select> </select> Год <select> </select> Год <select> </select> Год <select> </select> Год <select> </select> Год <select> </select> Год <select> </select> Год <select> </select> Год <select> </select> ye AR <SELECT> </select> Год <SEAL> </select> Год <SELECT> </select> Год <SELE> </selet> Год <SEAL> </select> Год <SELECT> </select> Год <SELTE> </select> Год <SEAL> </select> Год <SELUT> </select> Год <SELE> </select> Год <see> </s Elect> Год <SELECT> </selet> Год <SELECT> </select> Год <SELECT> </selet> Год <SEAL> </selet> Год <SELE> </select> Год <select> </select> Год <select> </select> Год <select> </select> Год <select> </select> Год <select> </selet> Год <se Лект> </select> Год <select> </select> Год <select> </select> Год <SELE> </select> Год <SEAL> </select> Год <select> </select> Год <select> </select> Год <select> </select> Год <select> </select> Год <select> </select> Год <select> </select> c ({'fm': 'alop', 'title': this.innerhtml, 'url': this.href, 'p1': al_c (this), 'p2': 1}) "href =" javascript: void (0) "> сегодня в истории </a> </div> </td> </td> </td> </table> <//td> </td> </table> <//td> </td> </table> </body> <script language = "javascript"> <!-(function () {var s = navigator.useragent.indexof ("msie")! = -1 &&! window.opera; function m (c) {return document.getElementbyId (c)} function r (c) {return document.creeleemement (c)} var puctied (c)} r (c) {return document.creeElement (c)} var pulse [0x040404, 0x04, 0x, 0x, 0x04, 0x. 0x0a570, 0x054d5, 0x0d260, 0x0d950, 0x16554, 0x056a0, 0x09ad0, 0x055d2, 0x04ae0, 0x0a5b6, 0x0a4d0, 0x0d250, 0x1d25555, 0x0A0, 0x0d250, 0x1d255, 0x0a0, 0x0a0, 0x0d250, 0x1d255, 0x0a0, 0x0, 0x04ae0. 0x0a2, 0x095b0, 0x14977, 0x04970, 0x0a4b0, 0x0b4b5, 0x06a50, 0x06d40, 0x1ab54, 0x02b60, 0x09570, 0x052f2, 0x04970, 0x06666, 0x0, 0x06666, 0x052f2, 0x04970, 0x06666, 0x052f2, 0x04970, 0x06666, 0x052f2, 0x04970, 0x09570, 0x052f2, 0x04970, 0x09570, 0x052f2, 0x04970, 0x09570, 0x052f2, 0x04970, 0x09570, 0x052f2, 0x04970, 0x09570. 0x0ea50, 0x06e95, 0x05ad0, 0x02b60, 0x186e3, 0x092e0, 0x1c8d7, 0x0c950, 0x0d4a0, 0x1d8a6, 0x0b550, 0x056a0, 0x1a5b4, 0x025d0, 0x092d0, 0x0d2b2, 0x0a950, 0x0b557, 0x06ca0, 0x0b550, 0x15355, 0x04da0, 0x0a5b0, 0x14573, 0x052b0, 0x0a9a8, 0x0e950, 0x06aaab0, 0xaiab50, 0xab50, 0xaiab50, 0x0aab50, 0x0aab50, 0x0aiab50, 0x0aab50, 0x0aab50, 0x0aab50, 0x0aab50, 0x0aab5 0x04b60, 0x0aae4, 0x0a570, 0x05260, 0x0f263, 0x0d950, 0x05b57, 0x056a0, 0x096d0, 0x04dd5, 0x04ad0, 0x0a4d0, 0x0d4, 0x0d550, 0x04ad0, 0x0a4d0, 0x0d4, 0x0d5550, 0x04ad0, 0x0a4d0, 0x0d4, 0x0d550, 0x04ad0, 0x0a4d0, 0x0d4, 0x04ad0, 0x0a4d0, 0x0d4, 0x04ad0, 0x0a4d0, 0x0d4, 0x04ad0, 0x0a4d0, 0x0d4, 0x04AD0, 0x0a4d0, 0x04, 0x04ad0, 0x0a4d0, 0x04d555 0x0b540, 0x0b6a0, 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, 0x07944, 0xa06, 0xa06, 0x066, 0x052b0, 0x0a930, 0x07944, 0xa0, 0x0, 0x0, 0xa0, 0xa0, 0xa0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x052b0, 0x0a5b0. 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, 0x0a0, 0x14b63]; Ding wu ji geng xin ren gui "; var j =" zi chou yin mao chen si wu wei shen you xu hai "; var o =" крыса, бык, тигр, кролик, дракон, змея, лошадь, овца, курица, собака, свинья "; вар L = [« Маленький холод »,« Большая холода »,« Птичья весна »,« Птичья весна »,« Птичья весна »,« Птица »,« Весна »,« Весна »,« Весна »,« Весна »,« Весна »,« Весна »,« Весна »,« Весна »,« Весна »,« Весна »,« Весна »,« Весна ». «Цинминг», «Великий дождь», «Начало лета», «Маленький человек», «Зерновые семена», «Летняя солнечная энергия», «Маленькая жара», «Большая жара», «Великая жара», «Птица осени», «Драконь 63836, 85337, 107014, 128867, 150921, 173149, 195551, 218072, 240693, 263343, 285989, 308563, 331033, 353350, 375494, 397447, 419210, 440795, 462224, 483532, 504758; «0101»: «*1 Новый год», «0214»: «День святого Валентина», «0305»: «Учитесь у Дня памяти Лей Фенг», «0308»: «День женщин», «0312»: «День Арбор», «0315»: «День 1,11». «0504»: «Молодежный день», «0601»: «Международный день детей», «0701»: «День рождения Коммунистической партии Китая», «0801»: «День армии», «0910»: «День преподавателей Китая», «1001»: «3 Национальный день», «1224»: «Рождество», «1225»: «VAR». «2 Весенний фестиваль», «0115»: «Фестиваль фонаря», «0505»: «*1 фестиваль лодок-дракона», «0815»: «*1 фестиваль в середине оседы», «0909»: «Двойной девятый фестиваль», «1208»: «Фестиваль лаба», «Функция», «Я)» (y). H = новая дата ((31556925974,7 * (J - 1900) + D [i] * 60000) + date.utc (1900, 0, 6, 2, 5); ? } Функция E (I, H) {return ((P [I - 1900] & (65536 >>)? 30: 29)} n> 0; 0 && k == (j + 1) && this.isleap == false) { -k; это. Функция g (h) {return h <10? Дело "DD" return g (h.getdate ()); «Двадцать»; "M"); this.lunarmonth = x.month; Z (this.lunarmonth, this.lunardate); this.jieqi = ""; == f (y, "d")) {this.showinlunar = this.jieqi = l [(this.solarmonth - 1) * 2 + 1]} if (c (this.solaryear, (this.solarmonth - 1) * 2 + 1]} if (this.showinlunar == "Qingming") {this.showinlar kinging j; this.restdays = 1} this.solarfestival = v [f (y, "mm") + f (y, "dd"); Parseint (regexp. $ 1); G (this.lunarmonth) + g (this.lunardate)]; this.Restdays: parseint (regexp. $ 1); } this.showinlunar = (this.lunarfestival == "")? X.lines = 0; } Функция C (A, B) {A.SetDate (A.GetDate () + B); G (A.Solaryear, A.Solarmonth- 1)) / 7); X.datearray [e] = null; return {init: function (a) {z (a)}, getjson: function () {return x}}}) (); M (Top ») } Функция B (G) {C [G.Solaryear - 1901]. Дата (j, 3, 1); a (g); C.AppendChild (h)} для (var j = 1; j <13; j ++) {var h = r ("option"); G.Solarmonth); Функция C () {var z = Q.GetJson (); R (div "); + px " Y.style.color = "#666"; M (CM »). {var b = /(^ == "Object") {return e.replace (a, function (f, h) {var g = c [h]; return typeof (g) == "не определен"? "": g}}} return e} function g (b) {var a = q.getjson () #{Solaryear} Год#{Solarmonth} Месяц#{Solardate} День#{SolarWeekdayInchinese} "; "<br>#{ganzhiyear} Год#{ganzhimonth} месяц#{ganzhidate} day"; #{jieqi} </b> "} c.innerhtml = y (c, a); c.style.top = z.offsettop + z.offsetheight - 5 +" px "; c.style.left = z.offsetleft + z.offsetwidth - 5 +" px "; C.style.display = "non"} return {show: function (z) {g (z)}, hide: function () {x ()}, init: function (z) {c = z}}}) (); "http://zh.wikipedia.org/zh-cn/" + x.solarmonth + "%e6%9c%88" + x.solardate + "%e6%97%a5"} return {setlink: function (x) {c (x)}}); window.attachevent ("Onload", function () {w.reset (a)})} w.init (a);Выше приведено в этой статье, я надеюсь, что для всех будет полезно изучить программирование JavaScript.