123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162 |
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
- <meta http-equiv="x-ua-compatible" content="ie=7"/>
- <title>HTML+Jquery实现万年历</title>
- <link href="images/all.css" rel="stylesheet" type="text/css"/>
- <link href="images/skin.css" rel="stylesheet" type="text/css"/>
- <link href="images/fontSize12.css" rel="stylesheet" type="text/css"/>
- <link href="images/calendar.css" rel="stylesheet" type="text/css"/>
-
- <script type="text/javascript" src="js/jquery.js"></script>
- <script type="text/javascript" src="js/calendar.js"></script>
- </head>
- <body style="height:98%;">
- <div class="main">
- <div class="pathBar" style="margin-bottom:2px;">
- <div class="pathBarPos">
- </div>
- </div>
- <div id="myrl" style="width:820px; margin-left:auto; margin-right:auto; height:840px; overflow:hidden;">
- <form name=CLD>
- <TABLE class="biao" width="800px">
- <TBODY>
- <TR>
- <TD class="calTit" colSpan=7 style="height:30px;padding-top:3px;text-align:center;">
- <a href="#" title="上一年" id="nianjian" class="ymNaviBtn lsArrow"></a>
- <a href="#" title="上一月" id="yuejian" class="ymNaviBtn lArrow"></a>
- <div style="width:250px; float:left; padding-left:230px;">
- <span id="dateSelectionRili" class="dateSelectionRili"
- style="cursor:hand;color: white; border-bottom: 1px solid white;"
- onclick="dateSelection.show()">
- <span id="nian" class="topDateFont"></span><span
- class="topDateFont">年</span><span id="yue"
- class="topDateFont"></span><span
- class="topDateFont">月</span>
- <span class="dateSelectionBtn cal_next"
- onclick="dateSelection.show()">▼</span></span> <font id=GZ
- class="topDateFont"></font>
- </div>
- <!--新加导航功能-->
- <div style="left: 250px; display: none;" id="dateSelectionDiv">
- <div id="dateSelectionHeader"></div>
- <div id="dateSelectionBody">
- <div id="yearList">
- <div id="yearListPrev" onclick="dateSelection.prevYearPage()"><</div>
- <div id="yearListContent"></div>
- <div id="yearListNext" onclick="dateSelection.nextYearPage()">></div>
- </div>
- <div id="dateSeparator"></div>
- <div id="monthList">
- <div id="monthListContent"><span id="SM0" class="month"
- onclick="dateSelection.setMonth(0)">1</span><span
- id="SM1" class="month" onclick="dateSelection.setMonth(1)">2</span><span
- id="SM2" class="month" onclick="dateSelection.setMonth(2)">3</span><span
- id="SM3" class="month" onclick="dateSelection.setMonth(3)">4</span><span
- id="SM4" class="month" onclick="dateSelection.setMonth(4)">5</span><span
- id="SM5" class="month" onclick="dateSelection.setMonth(5)">6</span><span
- id="SM6" class="month" onclick="dateSelection.setMonth(6)">7</span><span
- id="SM7" class="month" onclick="dateSelection.setMonth(7)">8</span><span
- id="SM8" class="month" onclick="dateSelection.setMonth(8)">9</span><span
- id="SM9" class="month" onclick="dateSelection.setMonth(9)">10</span><span
- id="SM10" class="month" onclick="dateSelection.setMonth(10)">11</span><span
- id="SM11" class="month curr" onclick="dateSelection.setMonth(11)">12</span>
- </div>
- <div style="clear: both;"></div>
- </div>
- <div id="dateSelectionBtn">
- <div id="dateSelectionTodayBtn" onclick="dateSelection.goToday()">今天</div>
- <div id="dateSelectionOkBtn" onclick="dateSelection.go()">确定</div>
- <div id="dateSelectionCancelBtn" onclick="dateSelection.hide()">取消</div>
- </div>
- </div>
- <div id="dateSelectionFooter"></div>
- </div>
- <a href="#" id="nianjia" title="下一年" class="ymNaviBtn rsArrow" style="float:right;"></a>
- <a href="#" id="yuejia" title="下一月" class="ymNaviBtn rArrow" style="float:right;"></a>
- <!-- <a id="jintian" href="#" title="今天" class="btn" style="float:right; margin-top:-2px; font-size:12px; text-align:center;">今天</a>-->
- </TD>
- </TR>
- <TR class="calWeekTit" style="font-size:12px; height:20px;text-align:center;">
- <TD width="100" class="red">星期日</TD>
- <TD width="100">星期一</TD>
- <TD width="100">星期二</TD>
- <TD width="100">星期三</TD>
- <TD width="100">星期四</TD>
- <TD width="100">星期五</TD>
- <TD width="100" class="red">星期六</TD>
- </TR>
- <SCRIPT language="JavaScript">
- var gNum;
- for (var i = 0; i < 6; i++) {
- document.write('<tr align=center height="50" id="tt">');
- for (var j = 0; j < 7; j++) {
- gNum = i * 7 + j ;
- <!--onMouseOver="mOvr(this,' + gNum + ');" onMouseOut="mOut(this);"-->
- document.write('<td id="GD' + gNum + '" on="0" ><font id="SD' + gNum + '" style="font-size:22px;" face="Arial"');
- if (j == 0) document.write('color=red');
- if (j == 6)
- if (i % 2 == 1) document.write('color=red');
- else document.write('color=red');
- document.write(' TITLE=""> </font><br><font id="LD' + gNum + '" size=2 style="white-space:nowrap;overflow:hidden;cursor:default;"> </font></td>');
- }
- document.write('</tr>');
- }
- </SCRIPT>
- </tbody>
- </TABLE>
- <table class="biao" width="800px">
- <tr>
- <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
- <tr align="center">
- <td><input type=button value="元旦节" class="button6" onclick=dateSelection.goHoliday(0)></td>
- <td><input type=button value='春 节' class="button6" onclick=dateSelection.goHoliday(1)></td>
- <td><input type=button value='清明节' class="button6" onclick=dateSelection.goHoliday(3)></td>
- <td><input type=button value='五一节' class="button6" onclick=dateSelection.goHoliday(4)></td>
- <td><input type=button value='端午节' class="button6" onclick=dateSelection.goHoliday(5)></td>
- <td><input type=button value='中秋节' class="button6" onclick=dateSelection.goHoliday(8)></td>
- <td><input type=button value="国庆节" class="button6" onclick=dateSelection.goHoliday(9)></td>
- </tr>
- </table></td>
- </tr>
- </table></td>
- <td width="100%" align="center"><table border="1" cellpadding="5" cellspacing="5">
- <tr align="center">
- <td><input type=button value='提交' class="button6" onclick=h_submit()></td>
- <td><input type=button value="重置" class="button6" onclick=rebuild()></td>
- <td width="25" height="25" bgcolor="#FBBB67"> </td>
- <td>假 期 </td>
- <td width="25" bgcolor="#FFFFFF"> </td>
- <td>工作日 </td>
- <td width="25" bgcolor="#CFDFF0"> </td>
- <td>今 日</td>
- </tr>
- </table></td>
- </tr>
- </table>
- </form>
- </div>
- </div>
- <SCRIPT language="JavaScript">
- //提交
- function h_submit(){
- alert(hDays);
- }
- //重置
- function rebuild(){
- hDays=[];
- }
- </SCRIPT>
- <div id="details" style="margin-top:-1px;"></div>
- </body>
- </html>
|