Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 16.12.2019, 20:10
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,267

Besprizornik,
http://lexxus.github.io/jq-timeTo/
Ответить с цитированием
  #12 (permalink)  
Старый 16.12.2019, 20:56
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,267

css timer countdown digital clock js
Сообщение от Besprizornik
без внешних скриптов
https://codepen.io/virgilpana/pen/aObdPv

https://codepen.io/dervondenbergen/pen/dVPOwB

https://codepen.io/Alca/pen/BZbPrE
Ответить с цитированием
  #13 (permalink)  
Старый 16.12.2019, 20:58
Кандидат Javascript-наук
Отправить личное сообщение для Besprizornik Посмотреть профиль Найти все сообщения от Besprizornik
 
Регистрация: 24.02.2019
Сообщений: 120

рони,
именно то что нужно, возможно это совместить с твоим скриптом?
Ответить с цитированием
  #14 (permalink)  
Старый 16.12.2019, 21:34
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,267

Besprizornik,
Ответить с цитированием
  #15 (permalink)  
Старый 17.12.2019, 14:16
Профессор
Отправить личное сообщение для Блондинка Посмотреть профиль Найти все сообщения от Блондинка
 
Регистрация: 24.02.2019
Сообщений: 600

рони,
а не подскажешь как вывести текущее время, как в третьем посте только с использованием http://lexxus.github.io/jq-timeTo/?
Ответить с цитированием
  #16 (permalink)  
Старый 17.12.2019, 14:32
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,267

time-to clock
Блондинка,
theme: "black" можно убрать.
<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/time-to@1.2.3/timeTo.css">
    <script src="https://cdn.jsdelivr.net/npm/time-to@1.2.3/jquery.time-to.js"></script>
    <script>
$(function() {
var clock = $('.your-clock').timeTo({theme: "black"})
});
    </script>
</head>
<body>
<div class="your-clock"></div>
</body>
</html>
Ответить с цитированием
  #17 (permalink)  
Старый 17.12.2019, 14:48
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,449

Сообщение от Блондинка
а не подскажешь как вывести текущее время
Забыл перелогиниться?
Ответить с цитированием
  #18 (permalink)  
Старый 17.12.2019, 17:25
Профессор
Отправить личное сообщение для Блондинка Посмотреть профиль Найти все сообщения от Блондинка
 
Регистрация: 24.02.2019
Сообщений: 600

Rise,
я хочу тут заменить див с часами
Ответить с цитированием
  #19 (permalink)  
Старый 18.12.2019, 20:42
Профессор
Отправить личное сообщение для Блондинка Посмотреть профиль Найти все сообщения от Блондинка
 
Регистрация: 24.02.2019
Сообщений: 600

<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://cactus.lark.ru/css/TimeTo.css">
    <script src="http://cactus.lark.ru/js/TimeTo.js"></script>
    <script>
$(function() {
var clock = $('.your-clock').timeTo({theme: "black"})
});
    </script>
</head>
<body>
<div class="your-clock"></div>
</body>
</html>


возможно ли в этом скрипте добавить функцию, и сделать разделитель ':' мигающим?

Сообщение от рони Посмотреть сообщение
Блондинка,
var spans = [].slice.call(document.querySelectorAll('.colon'), 0);
            var colons =["hsl(0, 0%, 54%)", "hsl(0, 0%, 48%)", "hsl(0, 0%, 42%)", "hsl(0, 0%, 36%)", "hsl(0, 0%, 30%)", "hsl(0, 0%, 24%)", "hsl(0, 0%, 18%)", "hsl(0, 0%, 12%)", "hsl(0, 0%, 6%)", "hsl(0, 0%, 0%)"];
            step = 0;
            (function color()
            {
            spans.forEach(function(elem) {
            elem.style.color = colons[step];
              });
            step = ++step % colons.length;
            window.setTimeout(color, 100);
            })()

Последний раз редактировалось Блондинка, 18.12.2019 в 21:00.
Ответить с цитированием
  #20 (permalink)  
Старый 18.12.2019, 21:37
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,267

Сообщение от Блондинка
сделать разделитель ':' мигающим
<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/time-to@1.2.3/timeTo.css">
    <script src="https://cdn.jsdelivr.net/npm/time-to@1.2.3/jquery.time-to.js"></script>
    <style type="text/css">
    div.your-clock > span:nth-child(6), div.your-clock > span:nth-child(3) {
     animation: color 1s ease-in-out infinite;
    }
    @keyframes color {
            50% {
                color: #FFFFFF;
            }
    }
    </style>
    <script>
$(function() {
var clock = $('.your-clock').timeTo({theme: "black"})
});
    </script>
</head>
<body>
<div class="your-clock"></div>
</body>
</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Выводить текущее время каждую минуту DarkPhoenix Общие вопросы Javascript 3 16.06.2019 21:33
Текущее время в значение NeonMan Events/DOM/Window 2 25.05.2019 17:36
Указать текущее время. luciusred Javascript под браузер 0 03.04.2018 10:27
Нужно, чтобы getTime() постоянно показывала текущее время без обновления страницы aldrve Общие вопросы Javascript 6 03.10.2017 20:29
Position fixed, но динамический по оси ОХ tvixa Элементы интерфейса 4 09.09.2013 15:39