您好,欢迎来到模板无忧!
登录
注册
閺€鎯版
閹兼粎鍌�
閸︽澘娴�
鐢喖濮�
模板无忧
网页特效
每日更新
|
TOP排行榜
|
Tag标签
|
充值
无忧首页
网页模板
程序模板
建站教程
视频教程
网页特效
图标素材
字体下载
站长工具
站长问答
关闭顶部
展开顶部
网页特效
菜单导航
图片特效
文本链接
层和布局
页面背景
表单按钮
日期时间
计算转换
键盘鼠标
浏览器
游戏娱乐
综合其它
常用代码
jQuery特效
Prototype
Ajax/JavaScript
ExtJS
CSS特效
在线编辑器
Mootools
HTML
JS广告代码合集
站长工具
站长常用软件
网站综合查询
Alexa排名查询
Google PR查询
域名Whois查询
网站收录查询
友情链接查询
CSS2中文手册
CSS精简优化工具
AI鐏忓繗浠� 閼宠棄鍟撴导姘辨暰
閸╃喎鎮�
閹恒劏宕�
展开边栏
关闭边栏
网页特效代码
模板无忧
>
网页特效
>
日期时间特效代码
>
收藏
分享
查看评论
日期时间
演示
日历和时间钟_日期时间特效
查看演示效果
特效Tag:
时间
日历
添加
缂佸洦鈪礑edeCMS鐟欏棝顣堕弫娆戔柤
娑旀壆鈹栭梻锟� 缁夌喐婀囬崝鈥虫珤 闁缍夌涵鏇氱鞍閼辨棑绱�
閺冪姴鍜栫粩娆撴毐瀹搞儱鍙�,閻ф儳瀹抽弶鍐櫢娑撯偓闁款喖鍙忛弻锟�!
日历和时间钟,您可以先修改部分代码再运行.
<HTML> <HEAD> <TITLE>日历和时间钟-模板无忧www.mb5u.com</TITLE> <meta http-equiv="Content-Type" mrc="text/html; charset=gb2312"> </HEAD> <BODY> <style type="text/css"> body { background-color: #D4D0C8; } .m_fieldset { padding: 0,10,5,10; text-align: center; width: 150px; } .m_legend { font-family: Tahoma; font-size: 11px; padding-bottom: 5px; } .m_frameborder { border-left: 2px inset #D4D0C8; border-top: 2px inset #D4D0C8; border-right: 2px inset #FFFFFF; border-bottom: 2px inset #FFFFFF; width: 100px; height: 19px; background-color: #FFFFFF; overflow: hidden; text-align: right; font-family: "Tahoma"; font-size: 10px; } .m_arrow { width: 16px; height: 8px; font-family: "Webdings"; font-size: 7px; line-height: 2px; padding-left: 2px; cursor: default; } .m_input { width: 18px; height: 14px; border: 0px solid black; font-family: "Tahoma"; font-size: 9px; text-align: right; ime-mode:disabled; } .c_fieldset { padding: 0,10,5,10; text-align: center; width: 180px; } .c_legend { font-family: Tahoma; font-size: 11px; padding-bottom: 5px; } .c_frameborder { border-left: 2px inset #D4D0C8; border-top: 2px inset #D4D0C8; border-right: 2px inset #FFFFFF; border-bottom: 2px inset #FFFFFF; background-color: #FFFFFF; overflow: hidden; font-family: "Tahoma"; font-size: 10px; width:160px; height:120px; } .c_frameborder td { width: 23px; height: 16px; font-family: "Tahoma"; font-size: 11px; text-align: center; cursor: default; } .c_frameborder .selected { background-color:#0A246A; width:12px; height:12px; color:white; } .c_frameborder span { width:12px; height:12px; } .c_arrow { width: 16px; height: 8px; font-family: "Webdings"; font-size: 7px; line-height: 2px; padding-left: 2px; cursor: default; } .c_year { font-family: "Tahoma"; font-size: 11px; cursor: default; width:55px; height:19px; } .c_month { width:75px; height:20px; font:11px "Tahoma"; } .c_dateHead { background-color:#808080; color:#D4D0C8; } </style> <script language="javascript"> // Written by cloudchen, 2004/03/15 function minute(name,fName) { this.name = name; this.fName = fName || "m_input"; this.timer = null; this.fObj = null; this.toString = function() { var objDate = new Date(); var sMinute_Common = "class=\"m_input\" maxlength=\"2\" name=\""+this.fName+"\" onfocus=\""+this.name+".setFocusObj(this)\" onblur=\""+this.name+".setTime(this)\" onkeyup=\""+this.name+".prevent(this)\" onkeypress=\"if (!/[0-9]/.test(String.fromCharCode(event.keyCode)))event.keyCode=0\" onpaste=\"return false\" ondragenter=\"return false\""; var sButton_Common = "class=\"m_arrow\" onfocus=\"this.blur()\" onmouseup=\""+this.name+".controlTime()\" disabled" var str = ""; str += "<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\">" str += "<tr>" str += "<td>" str += "<div class=\"m_frameborder\">" str += "<input radix=\"24\" value=\""+this.formatTime(objDate.getHours())+"\" "+sMinute_Common+">:" str += "<input radix=\"60\" value=\""+this.formatTime(objDate.getMinutes())+"\" "+sMinute_Common+">:" str += "<input radix=\"60\" value=\""+this.formatTime(objDate.getSeconds())+"\" "+sMinute_Common+">" str += "</div>" str += "</td>" str += "<td>" str += "<table border=\"0\" cellspacing=\"2\" cellpadding=\"0\">" str += "<tr><td><button id=\""+this.fName+"_up\" "+sButton_Common+">5</button></td></tr>" str += "<tr><td><button id=\""+this.fName+"_down\" "+sButton_Common+">6</button></td></tr>" str += "</table>" str += "</td>" str += "</tr>" str += "</table>" return str; } this.play = function() { this.timer = setInterval(this.name+".playback()",1000); } this.formatTime = function(sTime) { sTime = ("0"+sTime); return sTime.substr(sTime.length-2); } this.playback = function() { var objDate = new Date(); var arrDate = [objDate.getHours(),objDate.getMinutes(),objDate.getSeconds()]; var objMinute = document.getElementsByName(this.fName); for (var i=0;i<objMinute.length;i++) { objMinute[i].value = this.formatTime(arrDate[i]) } } this.prevent = function(obj) { clearInterval(this.timer); this.setFocusObj(obj); var value = parseInt(obj.value,10); var radix = parseInt(obj.radix,10)-1; if (obj.value>radix||obj.value<0) { obj.value = obj.value.substr(0,1); } } this.controlTime = function(cmd) { event.cancelBubble = true; if (!this.fObj) return; clearInterval(this.timer); var cmd = event.srcElement.innerText=="5"?true:false; var i = parseInt(this.fObj.value,10); var radix = parseInt(this.fObj.radix,10)-1; if (i==radix&&cmd) { i = 0; } else if (i==0&&!cmd) { i = radix; } else { cmd?i++:i--; } this.fObj.value = this.formatTime(i); this.fObj.select(); } this.setTime = function(obj) { obj.value = this.formatTime(obj.value); } this.setFocusObj = function(obj) { eval(this.fName+"_up").disabled = eval(this.fName+"_down").disabled = false; this.fObj = obj; } this.getTime = function() { var arrTime = new Array(2); for (var i=0;i<document.getElementsByName(this.fName).length;i++) { arrTime[i] = document.getElementsByName(this.fName)[i].value; } return arrTime.join(":"); } } </script> <script language="javascript"> // Written by cloudchen, 2004/03/16 function calendar(name,fName) { this.name = name; this.fName = fName || "calendar"; this.year = new Date().getFullYear(); this.month = new Date().getMonth(); this.date = new Date().getDate(); //private this.toString = function() { var str = ""; str += "<table border=\"0\" cellspacing=\"3\" cellpadding=\"0\" onselectstart=\"return false\">"; str += "<tr>"; str += "<td>"; str += this.drawMonth(); str += "</td>"; str += "<td align=\"right\">"; str += this.drawYear(); str += "</td>"; str += "</tr>"; str += "<tr>"; str += "<td colspan=\"2\">"; str += "<div class=\"c_frameborder\">"; str += "<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\" class=\"c_dateHead\">"; str += "<tr>"; str += "<td>日</td><td>一</td><td>二</td><td>三</td><td>四</td><td>五</td><td>六</td>"; str += "</tr>"; str += "</table>"; str += this.drawDate(); str += "</div>"; str += "</td>"; str += "</tr>"; str += "</table>"; return str; } //private this.drawYear = function() { var str = ""; str += "<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\">"; str += "<tr>"; str += "<td>"; str += "<input class=\"c_year\" maxlength=\"4\" value=\""+this.year+"\" name=\""+this.fName+"\" id=\""+this.fName+"_year\" readonly>"; //DateField str += "<input type=\"hidden\" name=\""+this.fName+"\" value=\""+this.date+"\" id=\""+this.fName+"_date\">"; str += "</td>"; str += "<td>"; str += "<table cellspacing=\"2\" cellpadding=\"0\" border=\"0\">"; str += "<tr>"; str += "<td><button class=\"c_arrow\" onfocus=\"this.blur()\" onclick=\"event.cancelBubble=true;document.getElementById('"+this.fName+"_year').value++;"+this.name+".redrawDate()\">5</button></td>"; str += "</tr>"; str += "<tr>"; str += "<td><button class=\"c_arrow\" onfocus=\"this.blur()\" onclick=\"event.cancelBubble=true;document.getElementById('"+this.fName+"_year').value--;"+this.name+".redrawDate()\">6</button></td>"; str += "</tr>"; str += "</table>"; str += "</td>"; str += "</tr>"; str += "</table>"; return str; } //priavate this.drawMonth = function() { var aMonthName = ["一","二","三","四","五","六","七","八","九","十","十一","十二"]; var str = ""; str += "<select class=\"c_month\" name=\""+this.fName+"\" id=\""+this.fName+"_month\" onchange=\""+this.name+".redrawDate()\">"; for (var i=0;i<aMonthName.length;i++) { str += "<option value=\""+(i+1)+"\" "+(i==this.month?"selected":"")+">"+aMonthName[i]+"月</option>"; } str += "</select>"; return str; } //private this.drawDate = function() { var str = ""; var fDay = new Date(this.year,this.month,1).getDay(); var fDate = 1-fDay; var lDay = new Date(this.year,this.month+1,0).getDay(); var lDate = new Date(this.year,this.month+1,0).getDate(); str += "<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\" id=\""+this.fName+"_dateTable"+"\">"; for (var i=1,j=fDate;i<7;i++) { str += "<tr>"; for (var k=0;k<7;k++) { str += "<td><span"+(j==this.date?" class=\"selected\"":"")+" onclick=\""+this.name+".redrawDate(this.innerText)\">"+(isDate(j++))+"</span></td>"; } str += "</tr>"; } str += "</table>"; return str; function isDate(n) { return (n>=1&&n<=lDate)?n:""; } } //public this.redrawDate = function(d) { this.year = document.getElementById(this.fName+"_year").value; this.month = document.getElementById(this.fName+"_month").value-1; this.date = d || this.date; document.getElementById(this.fName+"_year").value = this.year; document.getElementById(this.fName+"_month").selectedIndex = this.month; document.getElementById(this.fName+"_date").value = this.date; if (this.date>new Date(this.year,this.month+1,0).getDate()) this.date = new Date(this.year,this.month+1,0).getDate(); document.getElementById(this.fName+"_dateTable").outerHTML = this.drawDate(); } //public this.getDate = function(delimiter) { if (!delimiter) delimiter = "/"; var aValue = [this.year,(this.month+1),this.date]; return aValue.join(delimiter); } } </script> <table border="0"> <tr><td> <fieldset class="c_fieldset"><legend class="c_legend">日期(T)</legend> <!-- 调用日历 --> <script> var c = new calendar("c"); document.write(c); </script> <!-- 调用日历 --> </fieldset> </td> <td valign="top"> <fieldset class="m_fieldset"><legend class="m_legend">时间(T)</legend> <!-- 调用时间钟 --> <script> var m = new minute("m"); m.play(); document.write(m); </script> <!-- 调用时间钟 --> </fieldset> </td></tr> <tr> <td colspan="2"> <button onclick="alert(c.getDate())" style="font:8px Webdings;width:15px;height:15px;line-height:6px;">4</button> <button style="font:10px Arial;height:15px;height:16px;border:0px;" onfocus="this.blur()">GetDate</button> <button onclick="alert(m.getTime())" style="font:8px Webdings;width:15px;height:15px;line-height:6px;">4</button> <button style="font:10px Arial;height:15px;height:16px;border:0px;" onfocus="this.blur()">GetTime</button> </td> </tr> </table> </BODY> </HTML>
所属频道:
日期时间特效
/
更新时间:2012-12-14
[收藏]
[报错]
[返回列表]
评论加载中....
相关
日期时间特效
:
一款漂亮的日历脚本
柱状时钟
计算圆周率
随机数据显示功能、选号器
层时钟
跟随时钟
在线日历
一个倒记时
显示登陆时间
知道两点的坐标计算机出他们之间的距离
跟随鼠标的时钟
日期时间信息 Script
日期时间特效Rss订阅
特效代码搜索
日期时间特效推荐
JavaScript根据时间自动标示最新内容
纯Java Script时钟
又一款新颖的万年历
CSS实现带倒影的Js日期时钟
JavaScript进行日期计算的示例
带显示走动时间的超级酷挂历
背景时钟
用按钮来控制数字的升降
日期时间信息 Script
猜你的属相
猜你也喜欢看这些
32位JavaScript版MD5加密函数
计算文本框允许输入字符的百分比
手机号码抽奖程序
Js过滤空格代码
JavaScript对Email地址加密
JavaScript在线考试系统
JavaScript根据数据生成百分比图和柱状图
网页加密程序,基于JavaScript
JavaScript生成随机整数的代码
一个简单的JS加密函数
相关链接:
复制本页链接
|
搜索日历和时间钟
特效说明:
日期时间模板
-
日历和时间钟
。
閺€鎯版&閸掑棔闊�
QQ缁屾椽妫�
閺傜増姘顔煎触
閼垫崘顔嗗顔煎触
娴滆桨姹夌純锟�
瀵偓韫囧啰缍�
閻ф儳瀹抽幖婊嗘
婢跺秴鍩楃純鎴濇絻
閺囨潙顦�...