Diskusia – 28. diel - Časovače a animácie v JavaScripte

Späť

Upozorňujeme, že diskusie pod našimi online kurzami sú nemoderované a primárne slúžia na získavanie spätnej väzby pre budúce vylepšenie kurzov. Pre študentov našich rekvalifikačných kurzov ponúkame možnosť priameho kontaktu s lektormi a študijným referentom pre osobné konzultácie a podporu v rámci ich štúdia. Toto je exkluzívna služba, ktorá zaisťuje kvalitnú a cielenú pomoc v prípade akýchkoľvek otázok alebo projektov.

Komentáre

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:25.3.2019 14:13

těžko říct jestli jsem to tehdy počítal nebo odhadoval, ale v principu je to polovina obrázku s nějakým odsazením.

Odpovedať

25.3.2019 14:13

KaMl

Člen

KaMl:10.9.2021 13:26

Dokonalá lekce - díky moc!
Byla jsem skalní vyznavač C#, ale JavaScript pro mě začíná být ještě větší srdcovka... (v) (*_*)

Odpovedať

10.9.2021 13:26

Jaroslav Drobek

Člen

Jaroslav Drobek:7.5.2022 8:18

V každém případě 225 je polovina šířky (i délky) obrázku kolo.png v pixelech. Takže příkaz kontext.drawImage(obrazek, -225, -225); zajišťuje posun obrázku tak, aby střed kola štěstí splýval se středem zamýšlené rotace..

Odpovedať

7.5.2022 8:18

Jaroslav Drobek

Člen

Jaroslav Drobek:7.5.2022 8:24

Hodnocení:

Jak je to s časovou sousledností? Je úplně jedno, jestli příkaz zmenText(); je před nebo za setInterval(zmenText, 1000); ..
Má být " na webu mohou být" místo "ne webu mohou".
Pět stejných tagů (listy) - kde zůstala iredundance?
"Listy...začaly.."
Proč se CSS vlastnosti nedefinují v CSS souboru? Zvláště když už jej máme založený a neprázdný..

Odpovedať

7.5.2022 8:24

Jaroslav Drobek

Člen

Jaroslav Drobek:7.5.2022 8:24

Hodnocení (pokračování):

Funkce posun: neuvěřitelně objemný kód - to je asi ten strašák Javascriptu..
V dřívějších lekcích se používalo obrazek.parentElement.removeChild(obrazek); místo zdejšího obrazek.style.display = "none";.
Je nutné kontext.clearRect(0,0,500,500); ? Rotuje kruh podle svého středu..

Odpovedať

7.5.2022 8:24

Lubor Pešek

Člen

Lubor Pešek:21.6.2022 10:49

Našel jsem si věc, která mi přijde vcelku potřebná.
Jako Javista přirovnávám funkce setInterval a setTimeout k vláknům (jestli se pletu, prosím o opravu).
Proto mě samozřejmě zajímá, jak takové vlákno ukončit.
Tak jen přikládám ukázku, která by mohla být zahrnuta v článku:

//javascript
let i = 1;
let loop;
window.onload = function() {
        loop = setInterval(counter, 500);
}

function counter() {
        console.log(i++);
        if(i === 6) {
                clearInterval(loop);
        }
}

Nevím, jestli tam nebudou překlepy, píšu to z mobilu:)

Kód je jednoduchý - jde o UKONČENÍ SETINTERVAL METODY.
V podstatě (jak už to v JS chodí) si funkci uložím do proměnné (v mém případě loop).
Normálně inkrementuji po půl sekundách číslo a jak dojdu k číslu 6, tak zavolám metodu:

clearInterval();

které jako parametr předám právě tuto funkci.

Co jsem si našel, tak tím, že to vložím do nějaké proměnné tak nastavuji vlastně ID tohoto intervalu. Proto oficiálně metoda clearInterval() přijímá jako parametr ID nějakého counteru (kdyby jich běželo víc).

Logicky - když si to neuložíte do proměnné, tak to už neukončíte a běží vám to do konce života (respektive než vypnete browser:))

Odpovedať

21.6.2022 10:49

Existují dva způsoby, jak vyřešit problém. Za prvé vyhoďte počítač z okna. Za druhé vyhoďte okna z počítače.

Radek Lysák

Člen

Radek Lysák:12.8.2022 11:20

Prosím pěkně. Jak by se dalo u padající listí udělat, aby padalo postupně. Respektive, každý list aby začal padat v jiném čase, nikoliv všechny současně? Lámu si nad tím hlavu a nemůžu na to přijít.

Odpovedať

12.8.2022 11:20

DarkCoder

Člen

DarkCoder:12.8.2022 14:08

Je mnoho způsobů jak toho dosáhnout. Jedním z nich je způsob postupného nastavování časovače. Celá fáze má tři části - vykreslení, výběr, aktualizace. Když ma začít opadávání tak vybereš list a nastavíš interval. To je fáze výběru. Následně na všechny padající listy aplikuješ posun při pádu, to je fáze aktualizace. To je jedna iterace. Opět vykreslíš vše potřebné. Nyní otestuješ zda byl překročen interval. Pokud ano, vybereš nový list a opět nastavíš nový interval. Ideálně jiný, aby si docílil odlišné diference mezi padajícími listy. Opět aplikuješ pád na listy. To opalujes tak dlouho dokud nezastavíš celý proces.

Odpovedať

12.8.2022 14:08

"I ta nejlepší poučka postrádá na významu, není-li patřičně předána." - DarkCoder

Niki Vávrová

Člen

Niki Vávrová:23.2.2023 7:41

Srozumitelně napsaná lekce.

Odpovedať

23.2.2023 7:41

Natálie Růžičková

Tvůrce

Natálie Růžičková:25.10.2023 10:43

Děkujeme Jaroslave za tvé podněty, podívám se na to při aktualizaci.

Odpovedať

25.10.2023 10:43

Robíme čo je v našich silách, aby bola tunajšia diskusia čo najkvalitnejšia. Preto do nej tiež môžu prispievať len registrovaní členovia. Pre zapojenie sa do diskusie sa zaloguj. Ak ešte nemáš účet, zaregistruj sa, je to zadarmo.

Zobrazené 10 správy z 41.

Najčastejšie vyhľadávané

Diskusia – 28. diel - Časovače a animácie v JavaScripte