Перейти к содержимому

Как вставить часы на сайт

  • автор:

Часы для сайта

    Код скрипта нужно вставить между тегами . .

Код скрипта  function digitalClock() < var date = new Date(); var hours = date.getHours(); var minutes = date.getMinutes(); var seconds = date.getSeconds(); //* добавление ведущих нулей */ if (hours 
Вызов скрипта на странице  

Это простые часы без оформления стиля.

12-часовой формат времени: AM/PM
  1. AM = до полудня (от 00:00 до 11:00)
  2. PM = после полудня (от 12:00 до 23:00)
12-часовой формат времени: AM/PM   

Результат:

12-часовой формат времени:

Примеры оформления простых часов для сайта

в HTML документе
Часы для сайта

  1 2 3 

Результат скрипта

Цветные часы для сайта

в HTML документе
4
Цветные часы для сайта

   
: :

Результат скрипта

4
Цветные часы для сайта

Часы + дата

Хорошо смотрятся на сайте часы совместно с датой оформленные в одну строку.
В Примере 5 к скрипту часы добавлен скрипт дата.
Вид строки оформляется средствами css под дизайн сайта.

5 Часы + дата   Сегодня:   ( ) 

Аналоговые часы для сайта

в HTML документе

Виджеты Аналоговых часов для сайта

Виджет 1  Виджет 2  

Часы на Javascript для сайта

Несколько примеров реализации часов на Javascript для сайта. Простые цифровые часы , часы с секундами и миллисекундами , круглые часы со стрелками .

Самый простой способ реализации часов на JavaScript.

#clock
window.onload = function()< window.setInterval(function()< var now = new Date(); var clock = document.getElementById("clock"); clock.innerHTML = now.toLocaleTimeString(); >,1000); >;

Можно так (Javascript):

function clock() < var date = new Date(), hours = (date.getHours() < 10) ? '0' + date.getHours() : date.getHours(), minutes = (date.getMinutes() < 10) ? '0' + date.getMinutes() : date.getMinutes(), seconds = (date.getSeconds() < 10) ? '0' + date.getSeconds() : date.getSeconds(); document.getElementById('clock').innerHTML = hours + ':' + minutes + ':' + seconds; >setInterval(clock, 1000); clock();

See the Pen GgpgNd by DG Templates (@dgtemplates) on CodePen.

С текущей датой и днём недели:

Как добавить часы на HTML-страницу

на php можно написать, чтобы отображалось время
например:

  echo date("H:i:s"); ?> 

время обновляется только при обновлении страницы, а можно ли как-нибудь сделать так, чтобы время само изменялось?

 script language="JavaScript"> function vrem() < ndata = new Date(); hours = ndata.getHours(); mins = ndata.getMinutes(); secs = ndata.getSeconds(); tochki=':'; if(mins10) "0"+mins> if(secs10) "0"+secs> if (secs%2==0) document.getElementById("vremya").innerHTML=hours+":"+mins;> else document.getElementById("vremya").innerHTML=hours+tochki+mins;> setTimeout("vrem()", 1000); > script> 

к тегу подписать onload=»vrem()» (чтобы как-то так было: )

и в нужном месте страницы разместить

Похожие статьи

  • Озвучка часов
  • Часы и минуты перевести в минуты
  • Вызвать окно с системными часами
  • Часы на JavaScript

1. Дата и время

Мы выполним настройку на примере последнего сервиса.
Переходим по ссылке и задаём город, время в котором нужно отображать и другие настройки. Обратите внимание, что цвет можно указывать как текстом, так и в HEX или RGB форматах. Цвет фона указывать не нужно, его мы зададим при необходимости со стороны Платформы.

Далее - копируем код:

После переходим в редактор страницы и переносим виджет "Вставка HTML кода" в нужное место на странице:

Вставляем наш код, при необходимости задаём цвет фона и публикуем страницу:

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *