Предлагаю вашему вниманию пример реализации скрипта, который заполняет значение от нуля до заданного числа.
Изменяя в скрипте последнюю строчку можно легко задать конечное значение (число которое получим в результате) и длительность заполнения (время перехода от нуля до заданного значения).
ДемоHTML
<h1>Увеличение значения до заданного числа </h1> <p id="target">Значение будет тут</p> <p> Скрипт перехода от нуля до заданного числа. <br/> </p>
CSS
@import "http://adrienpaquot.be/TNA2/font/font.css"; body, header, main, section, footer, a, p, div, ul, li, h1, h2, h3, h4, h5, h6 { padding:0; margin:0; outline:0; text-decoration:none; list-style:none; } body { background:#DDD; font:16px/1.5 sans-serif; color:#555; } h1 { font:bold 24px/1.5 sans-serif; margin-top:100px; text-align:center; text-transform:uppercase; } #canvas_clock { margin:0 auto; margin-top:50px; display:block; margin-bottom:50px; } p { text-align:center; font-family:"aleoregular", serif; } #target { padding:50px 0; font-size:24px; }
JS
function ptn(id, a, b, c) { var x = i = 0; var y = 1000/70; var j = parseInt(b/y); y = b/j; var k = a/j; var int1 = setInterval(function() { if(i<j+1) { x = k * i; document.getElementById(id).innerHTML = (x.toFixed(c)); i++; }else { window.clearInterval(int1); } },y); } //ptn(идентификатор, конечное значение, длительность[в ms], nbDecimales); ptn("target", 9999999999, 1330, 0);
Обзор
Проголосуйте за урок
Оценка
Итог : Уважаемые читатели! Если вам понравилась статья не поленитесь проголосовать и оставить комментарий, ведь так я смогу понять полезность уроков и статей, и улучшить их качество в будущем. Заранее спасибо!