Tartalomjegyzék:

Konfigurálható Word Clock Simulator: 3 lépés
Konfigurálható Word Clock Simulator: 3 lépés

Videó: Konfigurálható Word Clock Simulator: 3 lépés

Videó: Konfigurálható Word Clock Simulator: 3 lépés
Videó: New York's LOST Pulitzer Tower | The Rise and Fall of The World Building - IT'S HISTORY 2024, November
Anonim
Konfigurálható Word Clock Simulator
Konfigurálható Word Clock Simulator

Ez nem éppen utasítás. Saját Word Clock -ot tervezek, és úgy döntöttem, hogy először felépítek egy webalkalmazás -szimulátort, hogy kirakhassam a rácsot, és kipróbálhassam, hogyan néz ki a nap különböző szakaszaiban. Aztán rájöttem, hogy ez hasznos lehet másoknak, akik szóórákon dolgoznak, és úgy döntöttem, megosztom.

Az alkalmazás egyetlen rövid HTML fájl. Ha elmenti és duplán kattint rá, megnyílik a böngészőben, és elkezdi megjeleníteni az aktuális időt. Ezután 10 másodpercenként frissíti a kijelzőt, ha az idő megváltozott.

Van egy szövegmező is, ahová tetszőleges időpontban gépelhet, és megnézheti, hogyan fog kinézni a projektben.

Mindenki szóórájának kialakítása más, ezért megpróbáltam könnyen konfigurálni a kódot. Tekintse meg a következő néhány lépést a tippekkel kapcsolatban, hogyan kell ezt megtenni.

Remélem hasznosnak találja ezt! Nagyszerű, hogy kísérletezhetünk az elrendezésekkel és a megfogalmazásokkal, mielőtt elkötelezzük magunkat a hardver mellett!

1. lépés: Töltse le a HTML -fájlt

A szimulátor egy fájlból álló webes alkalmazás. Alig 200 sor. Letöltheti innen.

(Valójában nincs gomb a fájl letöltéséhez a Githubon. De csak kiválaszthatja a fájl tartalmát, másolhatja és beillesztheti egy új szöveges fájlba a számítógépén. Ne felejtse el elnevezni a fájlt valamivel. Html.)

A letöltés után kattintson duplán a fájlra, és betöltődik a böngésző egyik lapjára. Látnia kell az aktuális időt egy szórácsban.

Megjegyzés: Az alkalmazást csak Chrome -on teszteltem Windows rendszeren.

2. lépés: Szerkessze a rácsot

Kipróbálhatja a különböző szóelrendezéseket a Javascript így szerkesztett darabjának szerkesztésével:

var row_strs = ["VAN", "EGY KETTŐ HÁROM", "NÉGY ÖT HAT", "SEVEN NIGHT", "NINE TEN", "ELEVEN TWELVE", "OH FIVE TEN", "FIFTEEN TWENTY", "O'CLOCK THIRTY", "NÉGY FIFTY FIVE", "DÉLTÁN", "ÉJSZAKA reggel",];

Ha sorokat ad hozzá/töröl, és újratölti az oldalt, a rács nagyobb vagy kisebb lesz.

És ha további betűket ad hozzá minden sorhoz, a rács szélesebb lesz. Csak győződjön meg arról, hogy minden sor azonos számú betűt tartalmaz.

Észre fogja venni, hogy a fenti kódban szereplő karakterláncokban szóközök vannak, de ezek véletlenszerű karakterekké alakulnak a rácsban. Kiválaszthatja azt a karakterkészletet, amelyet véletlenszerűen használnak majd a szóközök kitöltéséhez, az alábbi sor szerkesztésével:

var RANDCHARS = "ABCDEFGHIJKLMNOPQRSTUVWXYZ@#$%&";

3. lépés: Módosítsa a szöveget

Tudnia kell, hogyan kell kódot írni, ha különböző kifejezéseket szeretne használni. A dátumot felvevő és szavakká alakító logika a dateToSentence () függvényben található.

Ajánlott: