<MyRusakov.ru />

JavaScript, jQuery и Ajax с Нуля до Гуру

JavaScript, jQuery и Ajax с Нуля до Гуру

Видеокурс "JavaScript, jQuery и Ajax с Нуля до Гуру" научит Вас "вдыхать жизнь" в страницы, делая их с потрясающими эффектами и максимальным удобством для пользователя.

Курс научит Вас писать скрипты на JavaScript, а также обучит использованию библиотеки jQuery и технологии Ajax.

Практически любой красивый сайт (с красивыми галереями изображений, слайдерами, плавными переходами и так далее) использует jQuery. А практически на любом серьёзном сайте вовсю используется технология Ajax, которая делает работу с сайтом максимальной удобной.

Поэтому курс "JavaScript, jQuery и Ajax с Нуля до Гуру" Вам просто необходим, если Вы хотите создавать по-настоящему достойные сайты.

Подробнее
Подписка

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Каким движком Вы предпочитаете пользоваться?

Цифровые часы на JavaScript

Цифровые часы на JavaScript

Описание: Одним из самых простых и в то же время частоиспользуемых скриптов, является скрипт цифровых часов на JavaScript. Я думаю, что Вы часто на сайтах видели подобные часы, поэтому решил показать, как они делаются. Результат работы цифровых часов на JavaScript представлен ниже.

Результат:

Код JavaScript (вставлять между тегами <head> и </head>):

<script type="text/javascript">
  function digitalWatch() {
    var date = new Date();
    var hours = date.getHours();
    var minutes = date.getMinutes();
    var seconds = date.getSeconds();
    if (hours < 10) hours = "0" + hours;
    if (minutes < 10) minutes = "0" + minutes;
    if (seconds < 10) seconds = "0" + seconds;
    document.getElementById("digital_watch").innerHTML = hours + ":" + minutes + ":" + seconds;
    setTimeout("digitalWatch()", 1000);
  }
</script>

Код HTML (вставлять между тегами <body onload="digitalWatch()"> и </body>):

<p id="digital_watch" style="color: #f00; font-size: 120%; font-weight: bold;"></p>

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Порекомендуйте эту статью друзьям:

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так: Как создать свой сайт

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

Комментарии (27):

soffrick soffrick 25.06.2012 19:07:56

Возможно ли как-нибудь выводить определённое время? Например московское. Это нужно брать время по Гринвичу и прибавлять/отнимать?? Просто у юзера не всегда на компьютере стоит точное время, а мне хотелось бы выводить точное московское время

Ответить

Admin Admin 25.06.2012 19:09:40

Можно в PHP генерировать начальное время и подставлять в переменные.

Ответить

soffrick soffrick 25.06.2012 20:48:58

Спасибо, как-нибудь попробую

Ответить

zuryan zuryan 25.06.2012 21:34:33

Спасибо Михаил за науку Все доступно и понятно Удачи!

Ответить

Ignatenko102@mail.ru Ignatenko102@mail.ru 10.08.2012 13:00:49

почему не работает таймер <html> <head> <title>Таймер</title> <script language = "javascript"> function dynamic(str){ var x = 0; var = id setInterval(dynam. 100); function dynam() { document.getElementById("din").inner += str.char(x); if (x == string.length) clearInterval(id); } } </script> </head> <body> <span id = "din"></span> <script language = "javascript"> dynamic("Это динамический текст. Спасиюо за просмотр."); </script> </body> </html>

Ответить

Admin Admin 10.08.2012 13:41:02

Потому что у Вас очень много ошибок в коде. Переменная x никуда не передается, не правильно заданы аргументы для stInterval, inner вместо innerHTML и так далее. То, что Вы хотите сделать уже есть тут http://myrusakov.ru/javascript-dynamic-text.html

Ответить

bifotaun bifotaun 25.09.2012 18:05:57

Михаил как двигать например часы в то место где тебе надо ?

Ответить

Admin Admin 25.09.2012 21:18:31

Просто вставить код в то место страницы, которое Вам нужно.

Ответить

bifotaun bifotaun 26.09.2012 16:59:34

можно поподробней

Ответить

Admin Admin 27.09.2012 13:36:48

Код вставляется между тегами <body onload="digitalWatch()"> и </body>. А где конкретней, это уже надо смотреть в Вашем коде страницы.

Ответить

katushka katushka 28.11.2012 06:45:01

Здавстуйте, Михаил! А в дальнейшем можно будет как-нибудь изменить внешний вид часов, добавить красоты, так сказать?

Ответить

Admin Admin 28.11.2012 09:55:00

Через CSS.

Ответить

sergkosm sergkosm 05.04.2013 00:06:25

Михаил, а как можно создать стрелочные часы?

Ответить

Admin Admin 05.04.2013 11:19:05

Через JavaScript очень трудно, но возможно. Можете поискать готовые скрипты и попытаться в них разобраться.

Ответить

sergkosm sergkosm 05.04.2013 20:06:55

окей

Ответить

Олег Олег 27.07.2013 12:56:51

Почему, если 'startTime()' в скобках, таймер работает, а без скобок не работает? <script language="javascript"> var sep; function startTime() { var tm = new Date(); var h = tm.getHours(); var m = tm.getMinutes(); h = h<10? '0'+h: h; m = m<10? '0'+m: m; sep = sep == ':'? ' ': ':'; document.getElementById('time').innerHTML=h+sep+m; setTimeout('startTime()',1000); } </script> <body onload="startTime();"> <br /> <hr /> <br /> <div align=center> <b>Сейчас <span id="time"></span></b> </div> <br /> <hr /> <br /> </body>

Ответить

Admin Admin 27.07.2013 17:47:44

Это про какие скобки?

Ответить

Олег Олег 28.07.2013 20:57:05

Скобки вокруг startTime()! setTimeout('startTime()',1000); если их убрать, двоеточие не мигает.

Ответить

Олег Олег 27.07.2013 13:00:47

Как сделать чтобы при срабатывании таймера и выводе ":" в часах, не сдвигались минуты? Метод моноширинных шрифтов не устраивает. <script language="javascript"> var sep; function startTime() { var tm = new Date(); var h = tm.getHours(); var m = tm.getMinutes(); h = h<10? '0'+h: h; m = m<10? '0'+m: m; sep = sep == ':'? ' ': ':'; document.getElementById('time').innerHTML=h+sep+m; setTimeout('startTime()',1000); } </script> <body onload="startTime();"> <br /> <div align=center> <b>Сейчас <span id="time"></span></b> </div> <br /> </body>

Ответить

Admin Admin 27.07.2013 17:48:35

А чем Вам не понравились моноширинные шрифты? Иначе они будут сдвигаться всё равно.

Ответить

Олег Олег 28.07.2013 20:59:03

Я не проверял, но боюсь, что не все браузеры будут поддерживать такие шрифты. Я ошибаюсь?

Ответить

Admin Admin 29.07.2013 00:08:54

Не думаю что такая проблема может возникнуть.

Ответить

angry owl angry owl 26.07.2014 23:48:16

Помогите пожалуйста, Как изменить вид часов. Понятно, что это нужно делать через CSS. Но где именно в коде нужно задать класс для часов, для минут? Чтобы сделать рамку и для часов и для минут.

Ответить

alexandrdante alexandrdante 27.07.2014 00:04:21

там всё написано же. строчка с абзацем и стилями,в конце статьи

Ответить

angry owl angry owl 29.07.2014 13:31:52

Эта строчка изменения всех часов. А я имею в виду поменять цвет только часов, а минуты сделать другого цвета например. Или сделать рамку для каждого отдельно. По примеру часов на телефоне. Они как бы в отдельной рамке: часы и минуты.

Ответить

angry owl angry owl 26.07.2014 23:50:42

И еще может быть кто нибудь знает хороший скрипт - как поставить дату на сайте?

Ответить

angry owl angry owl 29.07.2014 13:35:10

А вот ссылка на сайт, где можно посмотреть скрипт для даты. Если кому интересно. :-) http://ab-w.net/JS/JS_date.php

Ответить

Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.