Простые часы для сайта на JavaScript

22016-04-22164512Денис Абдуллин

Это простой скрипт, который показывает системное время на JavaScript простым текстом. Часы, минуты и секунды через двоеточие – и все.

Для того, чтобы задать свой стиль часам, достаточно определить стиль для блока с ID – #time. В CSS Вы можете задать свой шрифт для часов, его цвет и размер. Если Вам нужны не простые часы, а более сложные, то посмотрите Flash часы для сайта. Откуда скрипт берет данные о времени? Показывается время именно то, которое установлено на устройстве.

Установка

Вставьте следующий код в то место на сайте, где хотите увидеть часы. На uCoz это может быть, например, «Верхняя» или «Нижняя части сайта»:

Код

<span id="time">00:00:00</span>

<script type="text/javascript">
setInterval(function () {
date = new Date(),
h = date.getHours(),
m = date.getMinutes(),
s = date.getSeconds(),
h = (h < 10) ? '0' + h : h,
m = (m < 10) ? '0' + m : m,
s = (s < 10) ? '0' + s : s,
document.getElementById('time').innerHTML = h + ':' + m + ':' + s;
}, 1000);
</script>

Скрипт сразу покажет в том месте, где Вы его установили, строчку текста с часами. Например, «00:00:00». Секунды, минуты и часы, кстати, всегда двузначные, поэтому смена значений происходит гладко.