Javascript倒计时 支持自定义样式
主要是ShowCountDown(2010, 08, 13, 'showData') 日期可以后台绑定。
JS脚本:
- <mce:script language="javascript" type="text/javascript"><!--
- var interval = 1000;
- function ShowCountDown(year, month, day, divname) {
- var now = new Date();
- //new Date(年,月,日,时,分,秒)
- var endDate = new Date(year, month - 1, day, 17, 30);
- var leftTime = endDate.getTime() - now.getTime();
- var leftsecond = parseInt(leftTime / 1000);
- var day1 = Math.floor(leftsecond / (60 * 60 * 24));
- var hour1 = Math.floor((leftsecond - day1 * 24 * 60 * 60) / 3600);
- var hour = Math.floor((leftsecond - 60 * 60) / 3600);
- //小时如果不大于0 显示为0
- if (hour > 0) {
- }
- else {
- hour = 0;
- }
- if (day1 < 0) {
- hour = hour1
- }
- var minute = Math.floor((leftsecond - day1 * 24 * 60 * 60 - hour1 * 3600) / 60);
- var second = Math.floor(leftsecond - day1 * 24 * 60 * 60 - hour1 * 3600 - minute * 60);
- var cc = document.getElementById(divname);
- //判断是否到活动时间 如果到活动时间 全部默认显示00:00:00
- if (leftTime > 0) {
- document.getElementById("daoYear").innerHTML = year + "年";
- document.getElementById("daoMonth").innerHTML = month + "月";
- document.getElementById("daoDay").innerHTML = day + "日";
- document.getElementById("daoji_s").innerHTML = hour + "时";
- document.getElementById("daoji_f").innerHTML = minute + "分";
- document.getElementById("daoji_m").innerHTML = second + "秒";
- }
- else {
- document.getElementById("daoYear").innerHTML = "0000" + "年";
- document.getElementById("daoMonth").innerHTML = "00" + "月";
- document.getElementById("daoDay").innerHTML = "00" + "日";
- document.getElementById("daoji_s").innerHTML = "00" + "时";
- document.getElementById("daoji_f").innerHTML = "00" + "分";
- document.getElementById("daoji_m").innerHTML = "00" + "秒";
- }
- }
- //showCountDown(年、月、日,Div ID)
- window.setInterval(function () { ShowCountDown(2010, 08, 13, 'showData'); }, interval);
- / --></mce:script>
Html:
- <div id="showData">
- <table>
- <tr>
- <td>
- 还有:
- </td>
- <td>
- <div id="daoYear">
- 0000</div>
- </td>
- <td>
- <div id="daoMonth">
- 00</div>
- </td>
- <td>
- <div id="daoDay">
- 00</div>
- </td>
- <td>
- <div id="daoji_s">
- 00</div>
- </td>
- <td>
- <div id="daoji_f">
- 00</div>
- </td>
- <td>
- <div id="daoji_m">
- 00</div>
- </td>
- </tr>
- </table>
- </div>
作者:Mr S.R Lee
出处:http://www.cnblogs.com/LeeYongze
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利.