Proč potřebujete časovač odpočítávání online? Čas je třeba urgentně změřit. Po ruce není žádné speciální zařízení. Je nepohodlné používat běžné hodinky nebo mobilní telefon? Dáváme vám do pozornosti online časovač. Je vysoce přesný a snadno se používá.
Online časovače jsou nepostradatelné během sportovního tréninku a kombinují několik věcí. Když je důležité nevynechat čas a jen měřit osobní rekordy. Je velmi důležité, abyste věděli, kolik stránek jste v daném časovém období přečetli. Kolik znaků za minutu napíšete nebo jak rychle můžete projít důležitým kolem ve hře.
Online časovač pro každý vkus
Existují odpočítávací časovače s lakonickým i originálním designem. Aplikaci můžete rozbalit na celou obrazovku. Ozdobte si plochu krásnou starožitností nebo přesýpacími hodinami, raketou, bombou, romantickou svíčkou. Všechny časovače mají praktické funkce. Nastavení času trvá jen několik sekund.
Online časovač odpočítávání se zvukem můžete použít přímo na našich webových stránkách. Otevřete libovolný časovač na celé obrazovce. Važte si svého času. Vše je velmi jednoduché a rychlé! Časovač můžete aktivovat za přítomnosti internetu zcela zdarma kdykoli vám to vyhovuje.
Jak funguje online odpočítávání času?
Všechny časovače uvedené v této části mají velmi jednoduché a pohodlné ovládání. Uveďte požadovaný časový interval, stiskněte „start“ a časovač začne fungovat!
Každý časovač odpočítávání má obvykle tři okna:
- první ukazuje hodiny
- ve druhé - minutě
- za třetí - sekundy
V případě potřeby můžete použít funkci „pauza“ nebo úkol úplně zrušit.
Chcete si vybrat nejlepší časovač online? Tady jsou všechny pulty. Vyberte si ten, který vám vyhovuje! Po použití časovače se také můžete podělit o svůj názor s ostatními!
Stává se, že k něčemu něco potřebujete odpočítávadlo„Na internetu existuje mnoho řešení, která jsou však buď velmi těžkopádná, nebo jsou závislá na jiných knihovnách. Dnes budeme zvažovat jak udělat časovač odpočítávání v javascriptu v 18 řádcích kódu.
Plán
- Vypočítejte zbývající čas
Nastavte správné datum ukončení
Nejprve musíte nastavit správné datum ukončení. Bude to řetězec v jakémkoli formátu, kterému rozumí Date.parse () metoda. Například:
Var termín = "2015-12-31";
Krátký formát
Var termín = "31.12.2015";
Nebo dlouhý formát
Var termín = "31. prosinec 2015";
Každý z těchto formátů umožňuje nastavit přesný čas (v hodinách, minutách, sekundách) a časové pásmo. Například:
Var deadline = "31. prosince 2015 23:59:59 GMT + 02: 00";
Vypočítejte zbývající čas
Funkce getTimeRemaining (endtime) (
var t = Date.parse (endtime) - Date.parse (nové Date ());
var sekund = matematická podlaha ((t / 1000)% 60);
var minutes = Math.floor ((t / 1000/60)% 60);
var hodiny = matematická podlaha ((t / (1000 * 60 * 60))% 24);
var dny = matematická podlaha (t / (1000 * 60 * 60 * 24));
vrátit se (
"celkem": t,
"dny": dny,
"hodiny": hodiny,
„minuty“: minuty,
„sekundy“: sekundy
};
}
Nejprve vytvoříme proměnnou t pro uložení zbývajícího času. Date.parse () metoda je vestavěná javascript a umožňuje převést řetězec s časem na hodnotu v milisekundách. To nám umožní odečíst jeden od druhého a získat rozdíl mezi nimi.
Var t = Date.parse (endtime) - Date.parse (nové Date ());
Přesuňte datum do vhodného formátu
Nyní chceme převést milisekundy na dny, hodiny, minuty a sekundy. Jako příklad použijeme sekundy:
Var sekundy = matematická podlaha ((t / 1000)% 60);
Pojďme zjistit, co se tady děje.
- Vydělte milisekundy číslem 1000 a převeďte je na sekundy
- Vydělte celkový počet sekund číslem 60 a zbytek uložte - nepotřebujete všechny sekundy, počítají se pouze ty, které zbývají po minutách
- Zaokrouhlete dolů na nejbližší celé číslo, protože chcete celé sekundy, ne jejich zlomky
Opakováním této logiky převedete milisekundy na minuty, hodiny a dny.
Výstup dat časovače jako opakovaně použitelný objekt
Když jsou hodiny, minuty a sekundy připraveny, musíme je vrátit jako opakovaně použitelný objekt.
Vrátit se (
"celkem": t,
"dny": dny,
"hodiny": hodiny,
„minuty“: minuty,
„sekundy“: sekundy
};
Tento objekt vám umožňuje zavolat vaši funkci a získat jakoukoli z vypočítaných hodnot. Zde je příklad, jak můžete získat zbývající minuty:
GetTimeRemaining (termín) .minuty
Pohodlné, že?
Zobrazte na stránce hodiny a zastavte je, když dosáhnou nuly
Nyní máme funkci, která nám vrací zbývající dny, hodiny, minuty a sekundy. Můžeme si vytvořit náš časovač. Nejprve vytvořte následující html struktura pro hodinky:
Poté napište funkci, která zobrazí data uvnitř našeho div "a:
Funkce initializeClock (id, endtime) (
var hodiny = document.getElementById (id);
var timeinterval = setInterval (funkce () (
" +
"hodin:" + t.hodin + "
" +
"minutes:" + t.minutes + "
" +
"sekundy:" + t.sekundy;
}
},1000);
}
Tato funkce má dva parametry: id položka, která bude obsahovat naše hodiny, a čas konce počítadla. Uvnitř funkce deklarujeme proměnnou hodiny a použijeme ho k uložení odkazu na náš hodinový blok, takže se nemusíme ptát DOM.
- Vypočítejte zbývající čas
- Zobrazit zbývající čas v našem div
- Pokud zbývající čas = 0, zastavte hodiny
Jediné, co zbývá, je spustit hodiny takto:
InitializeClock ("clockdiv", termín);
Gratulujeme! Nyní máte jednoduchý odpočítávací časovač v pouhých 18 řádcích kódu JavaScript.
Připravte si hodinky k zobrazení
Před stylingem musíme upřesnit pár věcí.
- Odstraňte počáteční zpoždění, aby se časovač zobrazil okamžitě
- Zefektivněte skript hodin, abyste nemuseli neustále obnovovat celé hodiny
- Podle potřeby přidejte nuly
Odstranění počátečního zpoždění
Používáme v hodinách setInterval aktualizovat zobrazení každou sekundu. Nejčastěji je to normální, kromě začátku, kde je zpoždění 1 s. Abychom to vyřešili, musíme hodiny aktualizovat jednou předtím setInterval nastartuje.
Chcete -li to provést, přesuňte anonymní funkci, které předáváme setInterval(ten, který aktualizuje hodiny každou sekundu) do své vlastní samostatné funkce, kterou zavoláme updateClock... Zavolejte tuto funkci jednou venku setInterval a pak jí znovu zavolejte dovnitř setInterval... Hodiny se tedy zobrazí bez zpoždění.
Ve vašem javascript nahradit toto:
Var timeinterval = setInterval (funkce () (...), 1000);
Aktualizace funkce Clock () (
var t = getTimeRemaining (endtime);
clock.innerHTML = "dny:" + t.dny + "
" +
"hodin:" + t.hodin + "
" +
"minutes:" + t.minutes + "
" +
"sekundy:" + t.sekundy;
if (t.celkem clearInterval (časový interval);
}
}
UpdateClock (); // spusťte funkci jednou, abyste se vyhnuli latenci
var timeinterval = setInterval (updateClock, 1000);
Zefektivnění skriptu
Aby byl skript efektivnější, nemusíme aktualizovat všechny hodiny, ale pouze čísla. Chcete -li to provést, vložte každé číslo do značky rozpětí a bude pouze aktualizovat tento obsah.
Tady html:
Dny:
Hodiny:
Minut:
Sekundy:
Var daysSpan = hodiny.querySelector (". Dny");
var hoursSpan = hodiny.querySelector (". hodiny");
var minutesSpan = hodiny.querySelector (". minuty");
var secondsSpan = clock.querySelector (". seconds");
Aktualizace funkce Clock () (
var t = getTimeRemaining (endtime);
DaysSpan.innerHTML = t.dny;
hoursSpan.innerHTML = t.hours;
minutesSpan.innerHTML = t.minutes;
secondsSpan.innerHTML = t.sekund;
...
}
Přidejte úvodní nuly
Pokud chcete úvodní nuly, můžete kód nahradit takto:
SecondsSpan.innerHTML = t.sekund;
Na toto:
SecondsSpan.innerHTML = ("0" + t.sekund) .slice (-2);
Závěr
Zvážili jsme jak udělat jednoduchý časovač odpočítávání javascriptu... Vše, co vám zbývá, je přidat styly. Děkuji za pozornost!
Představujeme vám novou, maximálně jednoduchou a funkční službu pro všechny, kterým není čas z toho či onoho důvodu lhostejný. Online časovač vám umožní načasovat čas, kdykoli jej budete potřebovat. Ať už je to načasování na sportovních akcích, nastavení vlastních osobních rekordů, nebo možná jen potřebujete načasování knedlíků. Osobně já, tvůrce této služby, ji sám používám, abych měl přehled o době vaření určitých pokrmů. Velmi pohodlné a správné. Moje vaření nežije bez časovače. Ve všem sleduji čas - od smažení řízků až po vaření boršče nebo kuřecí polévky. Nedávno se můj přítel přiznal, že používá můj online časovač jako budík! Koneckonců, na konci odpočítávání, předem stanoveného času, může časovač přehrát zvuk. A tady je jasné, že zvuk z reproduktorů počítače bude hlasitější než běžný budík, to znamená, že pravděpodobnost probuzení je vyšší. Pro mě je to něco nového, abych byl upřímný, nikdy jsem si nemyslel, že online časovač lze použít jako budík, ale to vše proto, že má zvukovou funkci. Teď to zkusím sám. Ale tento web má více než jen časovač. Můžete také využít službu online stopky. Ano, nemusíte používat časovač, máte na výběr. Stopky se například velmi dobře používají při sportování doma. Můžete sledovat různé přístupy, přestávky mezi cvičeními, časy cvičení. Ale to není vše. Vždy se mi líbilo, že časovače odpočítávaly počet dní do určité události, například časovač, kolik dní zbývá do léta nebo časovač, kolik dní zbývá do Nového roku. Je to taková banální věc, ale někdy je zajímavé přijít a podívat se - kolik dní zbývá do ...
Jak používat svůj online časovač
Všechno je velmi jednoduché :)Přejít na web, vítejte! Přejděte na kartu „Časovač“, stisknutím zelené šipky spustíte odpočítávání. Chcete -li odpočítávání pozastavit, klikněte na Pozastavit (oranžové tlačítko). Tlačítko Stop zastaví časování. A otočné tlačítko s modrou šipkou resetuje hodnoty časovače. Samozřejmě můžete vystavovat, kdykoli budete potřebovat. Zejména pro pohodlí jsem připravil předvolby pro časové značky, stačí umístit kurzor na tlačítko časovače a moje stránky vám nabídnou, abyste si vybrali čas, který potřebujete. Pokud požadovaný čas není k dispozici, nevadí, můžete čas potřebný pro načasování zadat ručně.
A co je nejdůležitější, online časovač je zcela zdarma a snadno se používá. Vyrobil jsem ho v první řadě pro sebe, pro své kulinářské potřeby, a tedy vysokou kvalitu. Přesvědčte se právě teď, využijte bezplatnou službu - online časovač, stopky nebo odpočítávání důležitých událostí.
V rámci představeného nástroje jsou implementovány různé režimy provozu online stopek:
- Stopky - živé odpočítávání
- Odpočítávací časovač se zvukem
- Intervalový časovač
Bezplatné stopky lze použít například k měření tepové frekvence, registraci neoficiálních sportovních úspěchů nebo předávání standardů. Pro obchodníky a testery mohou být online stopky užitečné pro načasování při kontrole použitelnosti webu nebo aplikace (posouzení použitelnosti). Odpočítávání lze využít při tréninku, například při skládání a rozebírání zbraní nebo Rubikově kostce.
Počáteční nastavení stopek nebo časovače odpočítávání se nastavuje přímo v rozhraní, stačí kliknout na čísla a nastavit požadovanou hodnotu.
Intervalový časovač pro cvičení
Fitness Timer lze použít k nastavení intervalů pro Tabata a další intervalová cvičení, která střídají odpočinek a práci s vysokou intenzitou. Podporováno nastavením intervalů práce a odpočinku, nastavením počtu kol (opakování).
Stopky jsou k dispozici online a zdarma. V časovači můžete nastavit odpočítávání na 30 sekund, 1, 2 minuty nebo kdykoli. Program nemusíte stahovat do počítače ani instalovat aplikaci do telefonu. Službu online časovače lze použít ve vhodný čas a na vhodném místě přes internet.
Dobrý den, milí přátelé. V jednom z předchozích článků jsem diskutoval, zda použít (také nazývaný odpočítávací měřič) na vaší vstupní stránce. Pokud si tedy myslíte, že to potřebujete, dnes vám povím, jak to propojit s vaší vstupní stránkou.
Budeme mluvit o několika možnostech, v jednom případě to bude skript čítače odpočítávání, který se bude opakovat každých 24 hodin. To znamená, že budete moci provést propagaci. Například: „do konce dne -“ a časovač ukáže, kolik času zbývá do konce dne. Na konci dne se časovač restartuje a začne znovu počítat
A v jiné verzi vám povím o online službě, která vám umožní připojit čítač odpočítávání. Zde se však předpokládá, že měřič je navržen na dlouhou dobu. Například plánujete otevřít web za měsíc a zatím jste udělali útržek jako:
Můžete jej použít různými způsoby, například pokud je propagace jednorázová a je navržena na dlouhou dobu, pak je online připojení výhodnější, protože stačí přidat jeden řádek kódu na správné místo . Obecně si v závislosti na účelu vyberte tu správnou možnost. Začněme ...
Počítadlo času odpočítávání s restartem
Počítadlo odpočítávání, které se po dni restartuje. Byl vyvinut jedním řemeslníkem, který má blog mywpnote.ru. Na blog jsem narazil asi před půl rokem a hodně mi to tehdy pomohlo. Dnes vám chci říci o jednom z měřičů, které vyvinul, a popsat, jak jej připojit.
Vzhled časovačů je následující:
Stáhněte si zdroje a v archivu uvidíte 4 složky s názvem vid1, vid2, vid3, vid4 - mají různé typy designu časovače. Můžete vše vidět a vybrat si, co se vám líbí. Způsob připojení je pro všechny stejný.
Použiji 4, protože se mi zdá být nejvšestrannější. Otevřeme vid4 a pro většinu zdrojů v síti máme standardní sadu složek. (indexový soubor, složka stylů, složka obrázků a složka skriptů). Mírně jsem změnil strukturu souborů, abych začátečníkům usnadnil připojení čítače. To znamená, že jsem vložil skript časovače do samostatného souboru a dříve to bylo v indexu.
Jak na vstupní stránku přidat skript čítače odpočítávání?
Otevřete index.html v libovolném editoru (používám sublime3) a podívejte se na následující kód.
Odtud musíte zkopírovat propojení šablony stylů a skriptu (7 a 8 řádků) do projektu.
A také na místo, kam byste chtěli umístit časovač, musíte napsat tag div s třídou „countbox“ - řádek 13. Do kódu bylo speciálně umístěno několik připojení časovače, aby bylo jasné, že je lze na stránce použít vícekrát. Mnoho skriptů s tím má problémy a podruhé se nechtějí zobrazovat na obrazovce.
Nyní stačí do projektu zkopírovat složky img, css a js a také jejich obsah - a je to! Počítadlo odpočítávání bude fungovat! Jak vidíte, trvá to maximálně 5 minut a tak důležitý prvek bude na vašem webu přítomen. Pokud máte nějaké dotazy - napište do komentářů, určitě vám pomůžu připojit měřič!
Počítadlo odpočítávání online
Pro ty, kteří potřebují jiný typ čítače odpočítávání, který byl zmíněn na začátku článku, existuje služba s nehorázně jednoduchým způsobem připojení. Vše, co musíte udělat, je navštívit webovou stránku www.timegenerator.ru a vybrat si jeden z nabízených časovačů.
