Skip to main content

3. tími

Onnur uppgáva

Ger heimasíðuna meira livandi.

Vitlíki og kota · 3. tími · Uppgáva 2

Ger eina interaktiva mini-framsýning

Í síðstu uppgávu setti tú eina vá-effekt inn á heimasíðuna. Nú skalt tú fara eitt stig víðari og gera eina lítla interaktiva mini-framsýning, har brúkarin kann trýsta á knøttar og síggja nýtt innihald á síðuni.

Endamál

Tú skalt læra at brúka JavaScript til at broyta innihald á einari heimasíðu. Hetta kann gera síðuna meira livandi, tí brúkarin ikki bara lesur síðuna, men eisini kann kanna og velja.

Í hesi uppgávuni skalt tú læra:

  • hvussu fleiri knøttar kunnu broyta sama øki á síðuni
  • hvussu JavaScript kann skifta tekst ella mynd
  • hvussu ein síða kann gerast meira interaktiv
  • hvussu tú kanst biðja SkoleGPT um einfalda og greiða kotu
  • hví tú skalt broyta kotuna, so hon passar til títt egna evni

1. Hvat er ein mini-framsýning?

Ein mini-framsýning er eitt lítið øki á heimasíðuni, har brúkarin kann velja millum ymisk evni, fakta ella myndir. Tá ið brúkarin trýstir á ein knøtt, broytist innihaldið.

Dømi um mini-framsýningar

Djór Knøttar kunnu vísa fakta um føði, livistað og serlig eyðkenni.
Ítróttur Knøttar kunnu vísa reglur, kend fólk og útgerð.
Spæl Knøttar kunnu vísa persónar, stig, heimar ella góð ráð.
Filmur Knøttar kunnu vísa persónar, søgugongd, tónleik ella áhugaverd fakta.

2. Vel, hvat brúkarin skal kunna kanna

Nú skalt tú velja, hvat mini-framsýningin skal snúgva seg um. Tað skal passa til tína heimasíðu.

Tú kanst til dømis gera:

  • tríggjar knøttar við trimum ymiskum fakta
  • ein persónakassa, har brúkarin kann velja persón
  • eina myndaframsýning við stuttum teksti
  • eina “Vel eitt evni”-framsýning
  • eina lítla ráðgeving, har brúkarin velur millum ymiskar støður

3. Bið SkoleGPT um hjálp

Tú kanst skriva á donskum, tá ið tú biður um hjálp til kotu. Ver greið/ur um, at tú ert byrjari, og at kotan skal vera løtt at skilja.

Dømi um gott boð:

Jeg har lavet en enkel HTML-side om [emne]. Jeg vil gerne tilføje en lille interaktiv mini-udstilling med JavaScript. Den skal have: - tre knapper - et område, hvor teksten ændrer sig, når man trykker på en knap - simpel HTML, CSS og JavaScript - korte forklaringer i koden Jeg er begynder, så koden skal være enkel og let at forstå. Forklar bagefter kort, hvad HTML, CSS og JavaScript gør.

Tá ið tú fært svarið, skalt tú lesa tað og kanna, um tú skilur høvuðspartarnar.

4. Dømi: Trý fakta-kort

Ein góð byrjan er at gera trý knøttar. Hvør knøttur vísir eitt nýtt fakta ella eina nýggja frágreiðing um títt evni.

Boð til SkoleGPT:

Lav en enkel interaktiv faktaboks til min HTML-side om [emne]. Den skal have: - tre knapper - en overskrift, der ændrer sig - en kort tekst, der ændrer sig - simpel CSS, så boksen ser pæn ud - JavaScript, som er let at forstå Brug ikke svær kode. Forklar hvad getElementById og textContent gør.

Tú skalt síðani broyta tekstin til føroyskt og skriva tínar egnu upplýsingar í faktakortini.

5. Set kotuna inn á tína síðu

Tá ið tú hevur fingið eina kotu, skalt tú seta hana inn á tína heimasíðu. Ansa eftir, at HTML, CSS og JavaScript hoyra saman.

  1. Set HTML-partin har, sum mini-framsýningin skal síggjast.
  2. Set CSS-partin saman við hinum CSS-inum.
  3. Set JavaScript-partin niðast í síðuna, beint áðrenn </body>, um tað ber til.
  4. Royn allar knøttarnar.
  5. Brúka Kanna koturnar.
  6. Rætta villur, um tær koma fram.

6. Ger framsýningina til tína egnu

Tú skalt ikki lata mini-framsýningina vera júst soleiðis, sum SkoleGPT gav tær hana. Hon skal passa til tína heimasíðu og títt evni.

Tú skalt broyta minst fimm ting:

  • tekstin á knøttunum
  • yvirskriftina í framsýningini
  • tekstin, sum kemur fram
  • litirnar ella rammurnar
  • hvussu kassin sær út
  • evnið ella fakta-setningarnar
  • eina mynd, um tú velur at brúka mynd

7. Ger tað lætt hjá brúkaranum

Ein interaktiv síða skal vera løtt at brúka. Brúkarin skal skilja, hvat hann ella hon kann trýsta á, og hvat hendir aftaná.

  • Eru knøttarnir greiðir?
  • Sær brúkarin beinanvegin, hvar innihaldið broytist?
  • Er teksturin stuttur og lættur at skilja?
  • Passar útsjóndin til restina av síðuni?
  • Er tað ov nógv, sum hendir í senn?

8. Kanna, um tú skilir kotuna

Tú nýtist ikki at skilja alt fullkomiliga, men tú skalt kunna greiða frá høvuðshugsanini: Ein knøttur verður trýstur, og JavaScript broytir innihaldið.

  • Hvar eru knøttarnir í HTML-kotuni?
  • Hvat øki broytist, tá ið tú trýstir?
  • Hvør partur av kotuni er CSS?
  • Hvør partur av kotuni er JavaScript?
  • Hvat ger textContent?
  • Hvat hevur tú sjálv/ur broytt?

9. Tá ið tú ert liðug/ur

Svara hesum spurningum stutt:

  • Hvørja mini-framsýning gjørdi tú?
  • Hví passar hon til tína heimasíðu?
  • Hvat hjálpti SkoleGPT tær við?
  • Hvat broytti tú sjálv/ur?
  • Hvør partur var mest spennandi?
  • Hvat var torført?
  • Hvat lærdi tú um JavaScript?

Stutt sagt

Nú skalt tú gera eina síðu, har brúkarin kann velja og kanna innihald. Brúka SkoleGPT sum hjálp, men broyt tekst, útsjónd og innihald, so mini-framsýningin verður tín egna.