很多人在做博客的时候都会在自己的页面里加入一个日历,最近我也给做的网站里加入了一个。先前在网上收索了一翻关于此的源代码,看了下效果,感觉大多不尽如人意。偶然在一国外的网站上看见了一个不错的日历,主要是通过JavaScript中嵌入CSS来实现的,其中插入相应的代码还可以链接到自己的文档,相对来说还不错了。源码经过我修改了一番,现在此贴出,与大家共享。

核心脚本文件代码如下:
我修改后的JavaScript日历!// 头部区域class设置
我修改后的JavaScript日历!
document.write("<style type=text/css>\
我修改后的JavaScript日历!<!--\
我修改后的JavaScript日历!.cld_head_month {font-size: 11px;color: #5B557C;    font-family: Verdana, Arial, Helvetica, sans-serif;}\
我修改后的JavaScript日历!.cld_title {color: #5B557C; font-size: 11px; font-family: Geneva, Arial, Helvetica, sans-serif; TEXT-DECORATION: none;}\
我修改后的JavaScript日历!.cld_head_1 {color: #FFFFFF; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;background-Color: #CE5131;text-align: center; Height: 18px;Width: 20px;}\
我修改后的JavaScript日历!.cld_head_2 {color: #FFFFFF; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;background-Color: #CECBCE;text-align: center;Width: 20px; }\
我修改后的JavaScript日历!.cld_head_3 {color: #FFFFFF; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;background-Color: #CECBCE;text-align: center; Width: 20px;}\
我修改后的JavaScript日历!.cld_head_4 {color: #FFFFFF; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;background-Color: #CECBCE;text-align: center; Width: 20px;}\
我修改后的JavaScript日历!.cld_head_5 {color: #FFFFFF; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;background-Color: #CECBCE;text-align: center; Width: 20px;}\
我修改后的JavaScript日历!.cld_head_6 {color: #FFFFFF; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;background-Color: #CECBCE;text-align: center; Width: 20px;}\
我修改后的JavaScript日历!.cld_head_7 {color: #FFFFFF; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;background-Color: #0088C1;text-align: center;Width: 20px; }\
我修改后的JavaScript日历!.day_2 {color: #5B557C; font-size: 11px; font-family: Geneva, Arial, Helvetica, sans-serif; TEXT-DECORATION: none; text-align: center; Height: 18px;}\
我修改后的JavaScript日历!.day_3 {color: #5B557C; font-size: 11px; font-family: Geneva, Arial, Helvetica, sans-serif; TEXT-DECORATION: none; text-align: center;Height: 18px;}\
我修改后的JavaScript日历!.day_4 {color: #5B557C; font-size: 11px; font-family: Geneva, Arial, Helvetica, sans-serif; TEXT-DECORATION: none; text-align: center;Height: 18px;}\
我修改后的JavaScript日历!.day_5 {color: #5B557C; font-size: 11px; font-family: Geneva, Arial, Helvetica, sans-serif; TEXT-DECORATION: none; text-align: center;Height: 18px;}\
我修改后的JavaScript日历!.day_6 {color: #5B557C; font-size: 11px; font-family: Geneva, Arial, Helvetica, sans-serif; TEXT-DECORATION: none; text-align: center;Height: 18px;}\
我修改后的JavaScript日历!.day_1 {color: #CE5131; font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 11px; TEXT-DECORATION: none; text-align: center;Height: 18px;}\
我修改后的JavaScript日历!.day_7 {font-size: 11px; color: #0088C1; font-family: Geneva, Arial, Helvetica, sans-serif; TEXT-DECORATION: none; text-align: center;Height: 18px;}\
我修改后的JavaScript日历!.today{background-Color: #D0E6EF}\
我修改后的JavaScript日历!-->\
我修改后的JavaScript日历!</style>\
我修改后的JavaScript日历!
");
我修改后的JavaScript日历!
我修改后的JavaScript日历!
我修改后的JavaScript日历!
var c_y,c_m,c_d;
我修改后的JavaScript日历!
var page_span_id;
我修改后的JavaScript日历!
function calendar_url(year,month,day,link_name,css_class)
==============================================Cookie 结束

页面调用:
在页面插入下列代码:
我修改后的JavaScript日历!<script language="javascript" src="上述脚本文件的相对地址"></script>
我修改后的JavaScript日历!
<script language="javascript">
我修改后的JavaScript日历!
<!--
我修改后的JavaScript日历!showCalendar(
"calendar");
我修改后的JavaScript日历!
-->
我修改后的JavaScript日历!
</script>

然后在需要调用日历的地方用下列代码调用。
我修改后的JavaScript日历!<span id="calendar"></span>

相关文章: