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

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

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

Это простой скрипт, который показывает системное время на 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». Секунды, минуты и часы, кстати, всегда двузначные, поэтому смена значений происходит гладко.


Создать сайт в uKit Нужен классный сайт для бизнеса?
Воспользуйтесь сервисом uKit. Никакого кода!
Комментарии (2)
Mike Went 2014-10-07 в 12:14 / МатериалСпам
Люди, подскажите чайнику! Что в CSS писать надо? Можно образец для этих часов? Цвет, размер и т.д.?
0
Philip Rybalka ✔ 2014-08-26 в 03:01 / Материал
Я думаю, сейчас на сайт ставить часы нет смысла.
4
Чтобы оставить комментарий или отзыв под этой публикацией, войдите или зарегистрируйтесь.