当前位置: 首页 > 工具软件 > WebCalendar > 使用案例 >

Web Calendar ver 3.0 网页日历

柴嘉年
2023-12-01
Web Calendar ver 3.0 网页日历
版本描述
Web Calendar ver 3.0 是综合 JavaScript DHTML HTML CSS 的产品,且封装在 WebCalendar 实例中,调用与设置都非常方便
  Web Calendar ver 3.0 新加的功能:
1.对日历控件的对象式编程 2.对不同浏览器的兼容 3.对日历控件的样式颜色设置 4.对是否返回时分秒的设置 5.对年份下拉框的年跨度值的设置 6.增加了用方向键快捷键选择年月 7.增加了日历对网页空间的自适应显示 8.对日历日期显示机制的全新设计 Web Calendar ver 3.0 Author: meizz(梅花雪疏影横斜) mail: meizz@hzcnc.com Web Calendar ver 2.0 Author: walkingpoison(水晶龙) mail: wayx@kali.com.cn Web Calendar ver 1.0 Author: meizz(梅花雪疏影横斜) mail: meizz@hzcnc.com 在此我要特别感谢 walkingpoison(水晶龙) 和 emu(ston) 的大力支持,再次感谢!!
调用日历的代码示例 Web Calendar 的第一种调用方法:

代码: <input οnfοcus="calendar()">

Web Calendar 的第二种调用方法:

代码: <input name="txt" οnfοcus="calendar()"><input type=button value=calendar οnclick="calendar(document.form1.txt)">
对日历控件的定制
定义年下拉框的年跨值(两倍)定义返回的日期格式(可以用数字,分隔符 - /)
定义是否返回时分秒定义控件是否能被拖动
控件的暗色控件的亮色
控件的按钮背景色控件的文字颜色
控件的暗文字颜色日期数字背景色
今天在日历上的标示背景色日期显示的立体表达色

标准调用示例
<script language="JavaScript" src="calendar.js"></script>
  
  注:下面这段日历定制的 JavaScript 代码你可以一个都不定义,使用其默认值
  <script language="JavaScript"><!--
    WebCalendar.yearFall   = 50;           //定义年下拉框的年差值
    WebCalendar.format     = "yyyy-mm-dd" | "2003-06-07"; //回传日期的格式
    WebCalendar.timeShow   = false | true; //是否返回时间
    WebCalendar.drag       = true  | false;//是否允许拖动
    WebCalendar.darkColor  = "#0000D0";    //控件的暗色
    WebCalendar.lightColor = "#FFFFFF";    //控件的亮色
    WebCalendar.btnBgColor = "#FFFFF5";    //控件的按钮背景色
    WebCalendar.wordColor  = "#000080";    //控件的文字颜色
    WebCalendar.wordDark   = "#DCDCDC";    //控件的暗文字颜色
    WebCalendar.dayBgColor = "#E6E6FA";    //日期数字背景色
    WebCalendar.todayColor = "#FF0000";    //今天在日历上的标示背景色
    WebCalendar.DarkBorder = "#D4D0C8";    //日期显示的立体表达色
  //--></script>

  <input οnfοcus="calendar()">

Web Calendar 里的自定义函数名及其说明
函数名函数的用途说明(在主页面里自定义函数时请不要与以下的函数名冲突)
calendar()用户的主调函数
writeIframe()对iframe进行初始化
WebCalendar()初始化日历的设置
funMonthSelect()月份的下拉框
funYearSelect()年份的下拉框
prevM()往前翻月份
nextM()往后翻月份
prevY()往前翻 Year
nextY()往后翻 Year
hiddenSelect() 隐藏年份与月份的下拉框
hiddenCalendar()隐藏日历控件
appendZero(n)日期自动补零程序
dayMouseOver()日历里日期的 onmouseover 事件
dayMouseOut()日历里日期的 onmouseout  事件
writeCalendar()对日历显示数据的核心处理程序
returnDate()根据日期格式等返回用户选定的日期
document.onclick()if(WebCalendar.eventSrc != window.event.srcElement) hiddenCalendar();
若你要使用主网页的 document.onclick() 事件时,请加上上面这句代码(这句代码日历控件里已存在),
这句代码是当你点击日历以外的地方时日历自动关闭,若不使用 document.onclick() 事件就不需要再定义了.
全局变量 WebCalendar日历控件的实例,你可以通过它对日历进行定制
 
 类似资料: