Zobrazit stránkuStarší verzeZpětné odkazyNahoru Tato stránka je pouze pro čtení. Můžete si pouze prohlédnout zdrojový kód, ale ne ho měnit. Zeptejte se správce, pokud si myslíte, že něco není v pořádku. * Seznam se se [[https://www.w3schools.com/jsref/met_win_settimeout.asp|setTimeout]] a [[https://www.w3schools.com/jsref/met_win_setinterval.asp|setInterval]] pro načasování běhu funkce v javascriptu * Napiš program, který za pět sekund od otevření stránky vypíše zprávu/aktuální čas: * jako alert (message) * do input nebo textarea * do divu nebo nadpisu * Modifikuj program, aby aktuální čas vypisoval opakovaně * Vytvoř program, který bude počítat (a vypisovat) sekundy od načtení stránky. Jsou dvě možnosti: === Rekurze === ==== Čistokrevná na výpočet faktoriálu ==== <code javascript> function faktorial(n){ if(n==1){ return 1; }else{ return n*faktorial(n-1) } } console.log(faktorial(15)) </code> ==== Plánovací rekurze ==== <code javascript> function X(){ console.log(new Date()) setTimeout(X,1000) } X() </code> ==== Plánování jiné ==== <code javascript> function X(){ console.log(new Date()) } //setInterval naplánuje opakování každých 1000ms setInterval(X,1000) </code> ==== Minimální slideshow ==== <code javascript> //existuje <img id="slideshow"> v html // var cislo_obrazku = 1; function prepniObrazek(){ document.getElementById("slideshow").src= cislo_obrazku +".jpg" //0, 1, 2 cislo_obrazku = (cislo_obrazku+1) % 3; } //setInterval naplánuje opakování každých 1000ms setInterval(prepniObrazek,5000) </code> ==== Fadein,fadeout ==== <code html> <!DOCTYPE html> <html> <head> <style> div { width: 100px; height: 100px; background-color: red; } .fadeout { animation-name: fadeout; animation-duration: 4s; animation-fill-mode: forwards; } .fadein { animation-name: fadein; animation-duration: 4s; animation-fill-mode: forwards; } @keyframes fadeout { from {opacity:1;} to {opacity:0;} } @keyframes fadein { from {opacity:0;} to {opacity:1;} } </style> </head> <body> <div class="fadein" id="ctverec"></div> <script> setTimeout(function(){ document.getElementById('ctverec').classList.remove("fadein"); document.getElementById('ctverec').classList.add("fadeout"); },5000) </script> </body> </html> </code> krouzek/slideshow.txt Poslední úprava: 2023/11/15 20:54autor: 127.0.0.1