标题 | 极品日历代码 |
内容 | 查看效果:日历效果 <script> var myc_x,myc_y; var myc_timeset=null,myc_timeset1=null; var divobj=null; var inputname; function mycalendar() //构建对象 { var mydate = new date(); this.year = mydate.getfullyear(); this.month = mydate.getmonth()+1; this.date = mydate.getdate(); this.format=yyyy-mm-dd; this.style = mystyle(1); this.show = createcalendar; this.input = createinput; } function mystyle(num) //设置样式 { if(!num||isnan(num)){alert('参数不对,采用默认样式!');num=1;} var style = new array(); style[1]=.week{background-color:#dfdfff;font-size:12px;width:140px;} +.ds{width:140px;font-size:12px;cursor:hand} +.mover{border:1px solid black;background-color:#f4f4f4;} +.move1{border:1px solid #5d5d5d;background-color:#f4f4f4;color:#909eff;font-size:12px} +.tit{background-color:#909eff;width:140px;font-size:12px;color:white;cursor:default} +.cs{position:absolute;border:1px solid #909eff;width:142px;left:0px;top:0px;z-index:9999;} +.shadow{position:absolute;left:0px;top:0px;font-family: arial black;font-size:50px;color:#d4d4d4;z-index:1;text-align:center;}; document.write(<style type='text/css'>); document.write(style[num]); document.write(</style>); } function createcalendar() { var week = new array('日','一','二','三','四','五','六'); document.write(<div class='cs' onselectstart='return false' oncontextmenu='return false' onmousedown='if(event.button==2)this.style.display=\none\' id='myc_div'><div class='shadow'></div><div style='position:absolute;left:0px;top:0px;z-index:1'>); //创建头部 document.write(<table class='tit' id='myc_top' onmousedown='myc_x=event.x-parentnode.parentnode.style.pixelleft;myc_y=event.y-parentnode.parentnode.style.pixeltop;setcapture()' onmouseup='releasecapture();' onmousemove='mycmove(this.parentelement.parentelement);'><tr><td width=10 onmouseover='this.style.color=\black\' onmouseout='this.style.color=\\' onclick='cutyear()' style='font-family: webdings;cursor:hand;' title='减少年份'>7</td><td title='减少月份' onmouseover='this.style.color=\black\' onclick='cutmonth()' onmouseout='this.style.color=\\' width=10 style='font-family: webdings;cursor:hand;'>3</td><td onmouseover=this.classname='move1'; onmouseout=this.classname='';divhidden(myc.parentelement.nextsibling); onclick='createyear(+this.year+,this);divshow(myc.parentelement.nextsibling);'></td><td onclick='createmonth(+this.month+,this);divshow(myc.parentelement.nextsibling)' onmouseover=this.classname='move1'; onmouseout=this.classname='';divhidden(myc.parentelement.nextsibling);></td><td width=10 onmouseover='this.style.color=\black\' onmouseout='this.style.color=\\' onclick='addmonth()' style='font-family: webdings;cursor:hand;' title='增加月份'>4</td><td width=10 style='font-family: webdings;cursor:hand;' onmouseover='this.style.color=\black\' onmouseout='this.style.color=\\' onclick='addyear()' title='增加年份'>8</td></tr></table>); //创建星期条目 document.write(<table class='week'><tr>); for(i=0;i<7;i++) document.write(<td>+week[i]+</td>); document.write(</tr></table>); //创建日期条目 document.write(<table class='ds' id='myc' cellspacing=2 cellpadding=0>); for(i=0;i<6;i++) { document.write(<tr>); for(j=0;j<7;j++) document.write(<td width=10% height=16 onmouseover='mover(this)' onmouseout='mout(this)' onclick='if(this.innertext!=\\)getvalue(inputname,this.innertext);myc_div.style.display=\none\'></td>); document.write(</tr>); } document.write(</table>); //建建水印 document.write(</div>); //创建选择图层 document.write(<div style='position:absolute;left:0px;top:0px;z-index:3' onmouseover=divshow(this) onmouseout=divhidden(this)></div>); document.write(</div>); //显示日期 showdate(this.year,this.month); myc_div.style.display='none'; } function getvalue(obj,value) { eval(obj).value=parseint(myc_top.cells[2].innertext)+-+parseint(myc_top.cells[3].innertext)+-+value; } function showdate(year,month) { var mydate = new date(year,month-1,1); var today = new date(); var day = mydate.getday(); var length = new array(31,30,31,30,31,30,31,31,30,31,30,31); length[1] = ((year%4==0)&&(year%100!=0)||(year%400==0))?29:28; for(i=0;i<myc.cells.length;i++)myc.cells[i].innerhtml = ; for(i=0;i<length[month-1];i++) { myc.cells[i+day].innerhtml = (i+1); if(new date(year,month-1,i+1).getday()==6||new date(year,month-1,i+1).getday()==0){myc.cells[i+day].style.color='red';} } myc_top.cells[2].innertext=year+年; myc_top.cells[3].innertext=month+月; with(myc.parentnode.previoussibling.style) { pixelleft=myc.offsetleft; pixeltop=myc.offsettop; height = myc.clientheight; width = myc.clientwidth; } myc.parentelement.parentelement.style.height=myc.parentelement.offsetheight; myc.parentelement.previoussibling.innerhtml=year; } //一些附加函数-------------------- //---------begin------------------- function mover(obj){obj.classname = 'mover';} function mout(obj){if(obj.classname=='mover')obj.classname = '';} function addyear(){var year = parseint(myc_top.cells[2].innertext);var month = parseint(myc_top.cells[3].innertext); year++;showdate(year,month);} function addmonth(){var year = parseint(myc_top.cells[2].innertext);var month = parseint(myc_top.cells[3].innertext);month++;if(month>12){month=1;year++;}showdate(year,month);} function cutyear(){var year = parseint(myc_top.cells[2].innertext);var month = parseint(myc_top.cells[3].innertext);year--;showdate(year,month);} function cutmonth(){var year = parseint(myc_top.cells[2].innertext);var month = parseint(myc_top.cells[3].innertext);month--;if(month<1){month=12;year--;}showdate(year,month);} function divs(obj) { if(obj!=divobj) { obj.style.backgroundcolor=#909eff; obj.style.color='black'; } if(divobj!=null) { divobj.style.backgroundcolor=''; divobj.style.color=''; } divobj = obj; } function divshow(obj) { if (myc_timeset!=null) cleartimeout(myc_timeset); obj.style.display='block'; } function divhidden(obj){myc_timeset=window.settimeout(function(){obj.style.display='none'},500);} function createyear(year,obj)//创建年份选择 { var ystr; var odiv; ystr=<table class='move1' cellspacing=0 cellpadding=2 width=+obj.offsetwidth+>; ystr+=<tr><td style='cursor:hand' onclick='createyear(+(year-20)+,myc_top.cells[2])'>上翻</td></tr>; for(i=year-10;i<year+10;i++) if(year==i) ystr+=<tr style='background-color:#909eff'><td style='color:black;height:16px;cursor:hand' onclick='myc_top.cells[2].innertext=this.innertext;showdate(+i+,parseint(myc_top.cells[3].innertext));myc.parentelement.nextsibling.innerhtml=\\'>+i+年</td></tr>; else ystr+=<tr><td style='cursor:hand' onmouseover=divs(this) onclick='myc_top.cells[2].innertext=this.innertext;showdate(+i+,parseint(myc_top.cells[3].innertext));myc.parentelement.nextsibling.innerhtml=\\'>+i+年</td></tr>; ystr+=<tr><td style='cursor:hand' onclick='createyear(+(year+20)+,myc_top.cells[2])'>下翻</td></tr>; ystr+=</table>; odiv = myc.parentelement.nextsibling; odiv.innerhtml=''; odiv.innerhtml = ystr; showdiv(odiv,obj.offsettop+obj.offsetheight,obj.offsetleft); } function createmonth(month,obj)//创建月份选择 { var mstr; var odiv; mstr=<table class='move1' cellspacing=0 cellpadding=2 width=+obj.offsetwidth+>; for(i=1;i<13;i++) if (month==i) mstr+=<tr style='background-color:#909eff'><td style='color:black;height:16px;cursor:hand' onclick='myc_top.cells[3].innertext=this.innertext;showdate(parseint(myc_top.cells[2].innertext),+i+);myc.parentelement.nextsibling.innerhtml=\\'>+i+月</td></tr>; else mstr+=<tr><td style='cursor:hand' onmouseover='divs(this)' onclick='myc_top.cells[3].innertext=this.innertext;showdate(parseint(myc_top.cells[2].innertext),+i+);myc.parentelement.nextsibling.innerhtml=\\'>+i+月</td></tr>; mstr+=</table>; odiv = myc.parentelement.nextsibling; odiv.innerhtml=''; odiv.innerhtml = mstr; showdiv(odiv,obj.offsettop+obj.offsetheight,obj.offsetleft); } function showdiv(obj,top,left) { obj.style.pixeltop=top; obj.style.pixelleft=left; } function mycmove(obj) { if(event.button==1) { var x = obj.clientleft; var y = obj.clienttop; obj.style.pixelleft= x+(event.x-myc_x); obj.style.pixeltop= y+(event.y-myc_y); window.status=myc_y; } } function showdiv2(obj) { inputname=obj.name; var e=obj; var ot = obj.offsettop; var ol=obj.offsetleft; while(obj=obj.parentelement){ot+=obj.offsettop;ol+=obj.offsetleft;} myc_div.style.pixeltop=ot+e.offsetheight; myc_div.style.pixelleft=ol; myc_div.style.display=block; } function createinput(name) {myc_div.style.display='none'; document.write(<input type='text' name='+name+' size=20 onfocus='showdiv2(this)'>); } // --------------end --------------------- </script> <script> var mycalendar=new mycalendar; mycalendar.year=2005; mycalendar.show(); mycalendar.input(txt1); </script> <input type=text name=test onfocus=showdiv2(this) readonly=true> |
随便看 |
|
在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。