В этой статье описывается эффект цифровых часов Web Countdown, реализованных JS. Поделитесь этим для вашей ссылки. Конкретный метод реализации следующим образом:
Скопируйте код следующим образом: <! Doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<голова>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> часы обратного отсчета, реализованные JavaScript </title>
<style>
тело, div {маржа: 0; падки: 0;}
Body {color: #ffff; Font: 16px/1,5/5fae/8f6f/96c5/9ed1;}
#countdown {width: 300px; text-align: center; anpure:#1a1a1a; маржа: 10px Auto; Padding: 20px 0;}
input {border: 0; width: 283px; высота: 50px; coursor: pointer; margin-top: 20px; фон: url (// www.vevb.com/jscss/demoimg/201210/btn-1.png) no-repeat;}
input.cancel {background -position: 0 -50px;}
span {color:#000; ширина: 80px; line-hight: 2; фон: #fbfbfb; граница: 2px solid#b4b4b4; маржа: 0 10px; padding: 0 10px;}
</style>
<Скрипт>
window.onload = function ()
{
var ocountdown = document.getElementById ("обратный отсчет");
var ainput = ocountdown.getElementsbytagname ("input") [0];
var timer = null;
ainput.onclick = function ()
{
this.classname == ""? (timer = setInterval (updateTime, 1000), updateTime ()): (clearInterval (таймер));
this.classname = this.classname == ''? "отмена" : '';
};
Формат функции (а)
{
вернуть a.toString (). Заменить (/^(/d) $/, '0 $ 1')
}
function updateTime ()
{
var aspan = ocountdown.getelementsbytagname ("span");
var oremain = aspan [0] .innerhtml.replace (/^0/, '') * 60 + parseint (aspan [1] .innerhtml.replace (/^0/, ''));
if (oremain <= 0)
{
ClearInterval (таймер);
Возвращаться
}
oremain--;
aspan [0] .innerhtml = format (parseint (oremain / 60));
oremain %= 60;
aspan [1] .innerhtml = format (parseint (oremain));
}
}
</script>
</head>
<тело>
<div id = "обратный отсчет">
<pran> 01 </span> min <pran> 40 </span> секунды
<input type = "button" value = "" />
</div> wulin.com www.vevb.com Код Спецэффекты
</body>
</html>
Я надеюсь, что эта статья будет полезна для каждого программирования JavaScript.