|
国之瑰宝网站http://szgzgb.com/确实有一些特点,例如,Ionize CMS框架的首个中文网站、使用多达5种幻灯图片显示技术、首创同一页面的多张图片即位放大等等。这里介绍的是它的另一个首创,中景万年历http://szgzgb.com/themes/zjtz/wnl/wnl200.html支持12个时柱的相关技术。
一般的万年历代码大同小异,但功能都差不多:只提供年柱、月柱、日柱,均没有提供时柱。原因可能有二,一是时柱不好计算,二是只提供一天中的某一时柱似乎没意思。笔者受http://www.360doc.com/content/11/0827/23/541740_143797306.shtml的启发,使中景万年历同时支持当天的12个时柱,相关技术如下: 修改其引用的chinese_calendar.js文件,修改显示详细日期资料的函数function mOvr(v) 1、在变量初始化尾部增加: var szn=" 甲乙丙丁戊己庚辛壬癸甲乙丙丁戊己庚辛壬癸".indexOf(cld[d].cDay.substr(0,1))*2-2; var szs=""; for(i=0;i<12;i++){ var n =(szn + i)%10; szs +=Gan[n]+Zhi[i]+" "; } 2、在显示串尾部增加当天的12个时柱: s= '<TABLE WIDTH="130" BORDER=0 CELLPADDING="2" CELLSPACING=0 BGCOLOR="#000066" style="opacity:0.8; -moz-opacity:0.8; filter:Alpha(opacity=80)"><TR><TD>' + '<TABLE WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=0><TR><TD ALIGN="right"><FONT COLOR="#ffffff" STYLE="font-size:9pt;">'+ cld[d].sYear+' 年 '+cld[d].sMonth+' 月 '+cld[d].sDay+' 日<br>星期'+cld[d].week+'<br>'+ '<font color="violet">农历'+(cld[d].isLeap?'闰 ':' ')+cld[d].lMonth+' 月 '+cld[d].lDay+' 日</font><br>'+ '<font color="yellow">'+cld[d].cYear+'年 '+cld[d].cMonth+'月 '+cld[d].cDay + '日'+szs+'</font>'+ '</FONT></TD></TR></TABLE>'+ festival +'</TD></TR></TABLE>'; 整个函数结果代码如下: function mOvr(v) { var s,festival; var sObj=document.getElementById('SD'+ v); var d=sObj.innerHTML-1; var szn=" 甲乙丙丁戊己庚辛壬癸甲乙丙丁戊己庚辛壬癸".indexOf(cld[d].cDay.substr(0,1))*2-2; var szs=""; for(i=0;i<12;i++){ var n =(szn + i)%10; szs +=Gan[n]+Zhi[i]+" "; } if(sObj.innerHTML!='') { sObj.style.cursor = 's-resize'; if(cld[d].solarTerms == '' && cld[d].solarFestival == '' && cld[d].lunarFestival == '') festival = ''; else festival = '<TABLE WIDTH=100% BORDER=0 CELLPADDING=2 CELLSPACING=0 BGCOLOR="#CCFFCC"><TR><TD>'+ '<FONT COLOR="#000000" STYLE="font-size:9pt;">'+cld[d].solarTerms + ' ' + cld[d].solarFestival + ' ' + cld[d].lunarFestival + '</FONT></TD>'+ '</TR></TABLE>'; s= '<TABLE WIDTH="130" BORDER=0 CELLPADDING="2" CELLSPACING=0 BGCOLOR="#000066" style="opacity:0.8; -moz-opacity:0.8; filter:Alpha(opacity=80)"><TR><TD>' + '<TABLE WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=0><TR><TD ALIGN="right"><FONT COLOR="#ffffff" STYLE="font-size:9pt;">'+ cld[d].sYear+' 年 '+cld[d].sMonth+' 月 '+cld[d].sDay+' 日<br>星期'+cld[d].week+'<br>'+ '<font color="violet">农历'+(cld[d].isLeap?'闰 ':' ')+cld[d].lMonth+' 月 '+cld[d].lDay+' 日</font><br>'+ '<font color="yellow">'+cld[d].cYear+'年 '+cld[d].cMonth+'月 '+cld[d].cDay + '日'+szs+'</font>'+ '</FONT></TD></TR></TABLE>'+ festival +'</TD></TR></TABLE>'; document.getElementById("detail").innerHTML = s; if (snow == 0) { dStyle.left = x+offsetx-(width/2); dStyle.top = y+offsety; dStyle.visibility = "visible"; snow = 1; } } } | |