30.03. .... jQuery - vežbe u bloku od 3 časa
Completion requirements
Kao inspiracija za prvi zadatak će ovaj put poslužiti sledeći video snimak:
Ali ... neće baš sve da bude isto:
- U svom folderu kreirati novi html fajl i otvoriti ga pomoću VS Code
- Uneti osnovni šablon za html
- U head deo uneti link ka jQuery biblioteci (ili pronađite na Internetu - ključne reči Jquery, Google CDN - ili kopirajte iz sledeće lekcije)
- ostalo možemo da radimo kao u video snimku
- ...
Kao inspiracija za drugi zadatak služi sledeći video snimak:
Šta radimo:
- Isto kao na početku prethodnog zadatka - kreirati novi fajl, uneti html šablon i link ka jQuery
- Uraditi samo prvi primer tako da se prilikom prelaska miša preko dugmeta u njemu nađe drugi tekst
- dodati deo u kojem se prilikom izlaska miša sa područja dugmeta pojavi malo drugačiji tekst na njemu
- ...
- Ostalo iz video snimka je za vežbu kod kuće
Treći zadatak:
- Na vašoj web stranici treba ubaciti sliku po izboru učenika (leptir, bomba, ...)
- U css-u dodati za sliku da mu je position: absolute, kao i stilizovati sliku po potrebi (veličina, okvir, border-radius, ...)
- Zadatak je da se vaša slika kreće po ekranu - način kretanja je za početak proizvoljan - po želji učenika
- podzadatak:
- na prelazak miša preko slike ona treba da se pomeri (polako), pa da se smanji ili poveća i da postane prozirnija nego što je bila
- ili
- na klik miša na sliku treba da se slika pomeri i / ili "eksplodira"
- ili
- nešto po izboru učenika u grupi
Cilj ove vežbe je demonstriranje mogućnosti u jQuery da se akcije za isti objekat nadovezuju sa tačkom - jedna iza druge ....
Last modified: Thursday, 30 March 2023, 1:21 PM