建站代码网

热门标签

倒计时器

你好!这里有一种很牛的倒计时器, 当在验证在线考试,日期时间,游戏倒计时的时间的时候,多数是有用的

下面是需要使用Javascript显示HTML网页的倒计时的代码

你明确了倒计时的范围(either <span> or <div> tag)和初始值,然后代码在HH:MM:SS格式下自动更新时间。
你也可以控制使用CSS标准的范围风格,正如下面的演示的一样和附带的代码。

你必须按照下面两个步骤来激活你的倒计时器

1. 包含附带的Countdown.js 文件:


<script type="text/javascript" src="CountDown.js"> <script>

2. 在这个部分的javascript如下:

<script type="text/javascript"> window.onload=WindowLoad; function WindowLoad(event) { ActivateCountDown("CountDownPanel", 100); } </script>



倒计时器面板是范围的ID(也就是说你应该有<span> or <div> with this ID,100应该是以秒倒计时)。

这是CountDown.js 文件
var _countDowncontainer=0;
var _currentSeconds=0;

function ActivateCountDown(strContainerID, initialValue) { _countDowncontainer = document.getElementById(strContainerID); if (!_countDowncontainer) { alert("count down error: container does not exist: "+strContainerID+ "nmake sure html element with this ID exists"); return; } SetCountdownText(initialValue); window.setTimeout("CountDownTick()", 1000); } function CountDownTick() { if (_currentSeconds <= 0) { alert("your time has expired!"); return; } SetCountdownText(_currentSeconds-1); window.setTimeout("CountDownTick()", 1000); } function SetCountdownText(seconds) { //store: _currentSeconds = seconds; //get minutes: var minutes=parseInt(seconds/60); //shrink: seconds = (seconds%60); //get hours: var hours=parseInt(minutes/60); //shrink: minutes = (minutes%60); //build text: var strText = AddZero(hours) + ":" + AddZero(minutes) + ":" + AddZero(seconds); //apply: _countDowncontainer.innerHTML = strText; } function AddZero(num) { return ((num >= 0)&&(num < 10))?"0"+num:num+"";
}





X