网页特效强势万年历

网上发现完全有js设计的强大的万年历，便于移植使用，保存下

效果如下图

代码如下：

<BODY onload=initial()>

<SCRIPT language=JavaScript>


///////////////////////////////////////////////////////////////////////////////

var cld;

function drawCld(SY,SM) {
var i,sD,s,size;
cld = new calendar(SY,SM);

if(SY>1874 && SY<1909) yDisplay = '光绪' + (((SY-1874)==1)?'元':SY-1874)
if(SY>1908 && SY<1912) yDisplay = '宣统' + (((SY-1908)==1)?'元':SY-1908)
if(SY>1911 && SY<1950) yDisplay = '民国' + (((SY-1911)==1)?'元':SY-1911)
if(SY>1949) yDisplay = '共和国' + (((SY-1949)==1)?'元':SY-1949)

GZ.innerHTML = yDisplay +'年农历' + cyclical(SY-1900+36) + '年   【'+Animals[(SY-4)%12]+'】';

YMBG.innerHTML = " " + SY + "<BR> " + monthName[SM];

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) { //日期内
sObj.innerHTML = sD+1;

if(cld[sD].isToday) sObj.className = 'todyaColor'; //今日颜色

sObj.style.color = cld[sD].color; //国定假日颜色

if(cld[sD].lDay==1) //显示农历月
lObj.innerHTML = '<b>'+(cld[sD].isLeap?'闰':'') + cld[sD].lMonth + '月' + (monthDays(cld[sD].lYear,cld[sD].lMonth)==29?'小':'大')+'</b>';
else //显示农历日
lObj.innerHTML = cDay(cld[sD].lDay);

s=cld[sD].lunarFestival;
if(s.length>0) { //农历节日
if(s.length>6) s = s.substr(0, 4)+'…';
s = s.fontcolor('red');
}
else { //国历节日
s=cld[sD].solarFestival;
if(s.length>0) {
size = (s.charCodeAt(0)>0 && s.charCodeAt(0)<128)?8:4;
if(s.length>size+2) s = s.substr(0, size)+'…';
s = s.fontcolor('blue');
}
else { //廿四节气
s=cld[sD].solarTerms;
if(s.length>0) s = s.fontcolor('limegreen');
}
}
if(s.length>0) lObj.innerHTML = s;

}
else { //非日期
sObj.innerHTML = '';
lObj.innerHTML = '';
}
}
}

function changeCld() {
var y,m;
y=CLD.SY.selectedIndex+1900;
m=CLD.SM.selectedIndex;
drawCld(y,m);
}

function pushBtm(K) {
switch (K){
case 'YU' :
if(CLD.SY.selectedIndex>0) CLD.SY.selectedIndex--;
break;
case 'YD' :
if(CLD.SY.selectedIndex<149) CLD.SY.selectedIndex++;
break;
case 'MU' :
if(CLD.SM.selectedIndex>0) {
CLD.SM.selectedIndex--;
}
else {
CLD.SM.selectedIndex=11;
if(CLD.SY.selectedIndex>0) CLD.SY.selectedIndex--;
}
break;
case 'MD' :
if(CLD.SM.selectedIndex<11) {
CLD.SM.selectedIndex++;
}
else {
CLD.SM.selectedIndex=0;
if(CLD.SY.selectedIndex<149) CLD.SY.selectedIndex++;
}
break;
default :
CLD.SY.selectedIndex=tY-1900;
CLD.SM.selectedIndex=tM;
}
changeCld();
}

var Today = new Date();
var tY = Today.getFullYear();
var tM = Today.getMonth();
var tD = Today.getDate();
//////////////////////////////////////////////////////////////////////////////

var width = "130";
var offsetx = 2;
var offsety = 16;

var x = 0;
var y = 0;
var snow = 0;
var sw = 0;
var cnt = 0;

var dStyle;
document.onmousemove = mEvn;

//显示详细日期资料
function mOvr(v) {
var s,festival;
var sObj=eval('SD'+ v);
var d=sObj.innerHTML-1;

//sYear,sMonth,sDay,week,
//lYear,lMonth,lDay,isLeap,
//cYear,cMonth,cDay

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"><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 + '日</font>'+
'</FONT></TD></TR></TABLE>'+ festival +'</TD></TR></TABLE>';

document.all["detail"].innerHTML = s;

if (snow == 0) {
dStyle.left = x+offsetx-(width/2);
dStyle.top = y+offsety;
dStyle.visibility = "visible";
snow = 1;
}
}
}

//清除详细日期资料
function mOut() {
if ( cnt >= 1 ) { sw = 0 }
if ( sw == 0 ) { snow = 0;   dStyle.visibility = "hidden";}
else cnt++;
}

//取得位置
function mEvn() {
x=event.x;
y=event.y;
if (document.body.scrollLeft)
{x=event.x+document.body.scrollLeft; y=event.y+document.body.scrollTop;}
if (snow){
dStyle.left = x+offsetx-(width/2)
dStyle.top = y+offsety
}
}

///////////////////////////////////////////////////////////////////////////

function changeTZ() {
CITY.innerHTML = CLD.TZ.value.substr(6)
setCookie("TZ",CLD.TZ.selectedIndex)
}

function tick() {
var today
today = new Date()
Clock.innerHTML = today.toLocaleString().replace(/(年|月)/g, "/").replace(/日/, "");
Clock.innerHTML = TimeAdd(today.toGMTString(), CLD.TZ.value)
window.setTimeout("tick()", 1000);
}

function setCookie(name, value) {
var today = new Date()
var expires = new Date()
expires.setTime(today.getTime() + 1000*60*60*24*365)
document.cookie = name + "=" + escape(value)   + "; expires=" + expires.toGMTString()
}

function getCookie(Name) {
var search = Name + "="
if(document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if(offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset)
if(end == -1) end = document.cookie.length
return unescape(document.cookie.substring(offset, end))
}
else return ""
}
}

/////////////////////////////////////////////////////////

function initial() {
dStyle = detail.style;
CLD.SY.selectedIndex=tY-1900;
CLD.SM.selectedIndex=tM;
drawCld(tY,tM);

CLD.TZ.selectedIndex=getCookie("TZ");
changeTZ();
tick();
}

//-->
</SCRIPT>

<SCRIPT language=VBScript>

</SCRIPT>

<STYLE>.todyaColor {
   BACKGROUND-COLOR: aqua
}
</STYLE>
<SCRIPT language=JavaScript></SCRIPT>

<DIV id=detail style="POSITION: absolute"></DIV>
<CENTER>
<FORM name=CLD>
<TABLE>
<TBODY>
<TR>
    <TD vAlign=top align=middle><FONT color=#ff6633 size=3>
      <SCRIPT language=JavaScript>
var enabled = 0; today = new Date();
var day; var date;
if(today.getDay()==0) day = "星期日"
if(today.getDay()==1) day = "星期一"
if(today.getDay()==2) day = "星期二"
if(today.getDay()==3) day = "星期三"
if(today.getDay()==4) day = "星期四"
if(today.getDay()==5) day = "星期五"
if(today.getDay()==6) day = "星期六"
document.fgColor = "000000";
date = " 佛历 " + (today.getYear()+544) + " 年 " +
(today.getMonth() + 1 ) + "月 " + today.getDate() + "日 " +
day +"";
document.write(date)
</SCRIPT>
      </FONT><BR><FONT style="FONT-SIZE: 9pt" size=2>本地时间:</FONT><BR><FONT
      id=Clock face=Arial color=#000080 size=4 align="center"></FONT>
      <P><FONT style="FONT-SIZE: 9pt" size=2><SELECT
      style="FONT-SIZE: 9pt" onchange=changeTZ() name=TZ> <OPTION
        value="-1200 安尼威土克、瓜甲兰" selected>国际换日线<OPTION
        value="-1100 中途岛、萨摩亚群岛">萨摩亚<OPTION value="-1000 夏威夷">夏威夷<OPTION
        value=-0900*阿拉斯加>阿拉斯加<OPTION value=-0800*太平洋时间(美加)、提亚纳>太平洋<OPTION
        value="-0700 亚历桑那">美国山区<OPTION value=-0700*山区时间(美加)>美加山区<OPTION
        value=-0600*萨克其万(加拿大)>加拿大中部<OPTION value=-0600*墨西哥市、塔克西卡帕>墨西哥<OPTION
        value=-0600*中部时间(美加)>美加中部<OPTION value=-0500*波哥大、里玛>南美洲太平洋<OPTION
        value=-0500*东部时间(美加)>美加东部<OPTION value=-0500*印第安纳(东部)>美东<OPTION
        value=-0400*加拉卡斯、拉帕兹>南美洲西部<OPTION value="-0400*大西洋时间加拿大)">大西洋<OPTION
        value="-0330 新岛(加拿大东岸)">纽芬兰<OPTION value="-0300 波西尼亚">东南美洲<OPTION
        value="-0300 布鲁诺斯爱丽斯、乔治城">南美洲东部<OPTION value=-0200*大西洋中部>大西洋中部<OPTION
        value=-0100*亚速尔群岛、维德角群岛>亚速尔<OPTION
        value="+0000 格林威治时间、都柏林、爱丁堡、伦敦">英国夏令<OPTION
        value="+0000 莫洛维亚(赖比瑞亚)、卡萨布兰卡">格林威治标准<OPTION
        value="+0100 巴黎、马德里">罗马<OPTION value="+0100 布拉格, 华沙, 布达佩斯">中欧<OPTION
        value="+0100 柏林、斯德哥尔摩、罗马、伯恩、布鲁赛尔、维也纳">西欧<OPTION
        value="+0200 以色列">以色列<OPTION value=+0200*东欧>东欧<OPTION
        value=+0200*开罗>埃及<OPTION value=+0200*雅典、赫尔辛基、伊斯坦堡>GFT<OPTION
        value=+0200*赫拉雷、皮托里>南非<OPTION
        value=+0300*巴格达、科威特、奈洛比(肯亚)、里雅德(沙乌地)>沙乌地阿拉伯<OPTION
        value=+0300*莫斯科、圣彼得堡、贺占、窝瓦格瑞德>俄罗斯<OPTION value=+0330*德黑兰>伊朗<OPTION
        value=+0400*阿布达比(东阿拉伯)、莫斯凯、塔布理斯(乔治亚共和)>阿拉伯<OPTION
        value=+0430*喀布尔>阿富汗<OPTION value="+0500 伊斯兰马巴德、克洛奇、伊卡特林堡、塔须肯">西亚<OPTION
        value="+0530 孟买、加尔各答、马垂斯、新德里、可伦坡">印度<OPTION
        value="+0600 阿马提、达卡">中亚<OPTION value="+0700 曼谷、亚加达、胡志明市">曼谷<OPTION
        value="+0800 北京、重庆、黑龙江">中国<OPTION value="+0800 台湾、香港、新加坡">台北<OPTION
        value="+0900 东京、大阪、扎幌、汉城、亚库兹(东西伯利亚)">东京<OPTION
        value="+0930 达尔文">澳洲中部<OPTION value="+1000 布里斯本、墨尔本、席德尼">席德尼<OPTION
        value="+1000 霍巴特">塔斯梅尼亚<OPTION value="+1000 关岛、莫斯比港、海　威">西太平洋<OPTION
        value=+1100*马哥大、所罗门群岛、新卡伦多尼亚>太平洋中部<OPTION
        value="+1200 威灵顿、奥克兰">纽西兰<OPTION
      value="+1200 斐济、肯加塔、马歇尔群岛">斐济</OPTION></SELECT>时间</FONT> <FONT id=tSave
      style="FONT-SIZE: 18pt; COLOR: red; FONT-FAMILY: Wingdings"></FONT><BR><BR><FONT
      style="FONT-SIZE: 120pt; COLOR: green; FONT-FAMILY: Webdings">û</FONT><BR><FONT
      id=CITY
      style="FONT-SIZE: 9pt; WIDTH: 150px; COLOR: blue; FONT-FAMILY: '宋体'"></FONT></P></TD>
    <TD align=middle>
      <DIV style="Z-INDEX: -1; POSITION: absolute; TOP: 30px"><FONT id=YMBG
      style="FONT-SIZE: 100pt; COLOR: #f0f0f0; FONT-FAMILY: 'Arial Black'"> 0000<BR> JUN</FONT>
      </DIV>
      <TABLE border=0>
        <TBODY>
        <TR>
          <TD bgColor=#000080 colSpan=7><FONT style="FONT-SIZE: 9pt"
            color=#ffffff size=2>西历<SELECT style="FONT-SIZE: 9pt"
            onchange=changeCld() name=SY>
              <SCRIPT language=JavaScript></SCRIPT>
            </SELECT>年<SELECT style="FONT-SIZE: 9pt" onchange=changeCld()
            name=SM>
              <SCRIPT language=JavaScript></SCRIPT>
            </SELECT>月</FONT> <FONT id=GZ face=宋体 color=#ffffff
            size=4></FONT><BR></TD></TR>
        <TR align=middle bgColor=#e0e0e0>
          <TD width=54>日</TD>
          <TD width=54>一</TD>
          <TD width=54>二</TD>
          <TD width=50>三</TD>
          <TD width=54>四</TD>
          <TD width=54>五</TD>
          <TD width=54>六</TD></TR>
        <SCRIPT language=JavaScript></SCRIPT>
        </TBODY></TABLE></TD>
    <TD vAlign=top align=middle width=60><BR><BR><BR><BR><BUTTON
      style="FONT-SIZE: 9pt" onclick="pushBtm('YU')">年↑</BUTTON><BR><BUTTON
      style="FONT-SIZE: 9pt" onclick="pushBtm('YD')">年↓</BUTTON>
      <P><BUTTON style="FONT-SIZE: 9pt"
      onclick="pushBtm('MU')">月↑</BUTTON><BR><BUTTON style="FONT-SIZE: 9pt"
      onclick="pushBtm('MD')">月↓</BUTTON>
      <P><BUTTON style="FONT-SIZE: 9pt" onclick="pushBtm('')">当月</BUTTON>
      </P></TD></TR></TBODY></TABLE></FORM></CENTER>
</body>

posted @ 2012-05-21 00:13 lives0815 阅读(546) 评论(0) 编辑收藏举报

刷新页面返回顶部

shengkejava

网页特效强势万年历

公告