Oblig X-Y-Z
- Forfall 12. sep. 2021 av 23.59
- Poeng 0
- Må leveres en filopplasting
- Tilgjengelig til 27. nov. 2021 i 23.59
Målet er å øve mer på filer og lenker.
Lag en mappe for obligxyz. Skriv X.html der det står "Du er på X. Gå videre". Ved å klikke på "Gå videre" kommer man til Y.html. Der står det "Du er på Y. ▶▶▶". Pilen skal kodes som HTML entity nummer 9654 (en av UTF-8 sine geometriske former). Ved å klikke på de tre pilene havner man på Z.html, der det står "Du er på Z", etterfulgt av et bilde av en høyrepil. Når bildet klikkes sendes man til AE.html, der en HTML button med teksten "Gå videre" tar deg tilbake til X.html.
EDIT: Endret filnavn fra Æ.html til AE.html pga rapportert problem ved pakking i Windows.
EDIT 2: Da <a> ikke skal inneholde interaktive element ifølge HTML5-standarden, og <button> er definert som et interaktivt element, er det greit om dere dropper AE.html, og bare gjøre X-Y-Z. Mer om dette på stackoverflow, med ei lenke til standarden, for spesielt interesserte.
Som pilbilde kan du laste ned dette og legge i bilder-mappa. Lenk det inn slik: <a ...> <img ..> </a>
Pilbildet skal ikke være høyere enn teksten (hint: height=). Alle filene skal bruke "stil.css" som lager en stiplet grønn ramme rundt alle <a>-lenkene med litt luft (padding) mellom lenken (innholdet) og selve rammen.
Når du skal levere, pakker du hele mappa obligxyz til ei zipfil (Windows: Høyre-klikk mappa og velg ZIP). Last opp obligxyz.zip som svar.
Etter fristen utfører dere hverandre-vurdering. Last ned og pakk ut ZIP-filen. Sjekk at alt virker. Skriv en liten kommentar og trykk "Lagre".
Om du er i tvil, står det litt om hverandre-vurdering her hos Oslo Met:
https://oslomet.instructure.com/courses/12326/pages/studentveiledning-gi-og-lese-hverandrevurdering
---
Resten er frivillig: Fra AE.html går man til OE.html, der et SVG-bilde av ei pil tar en til AA.html, der en CSS-generert høyrepil tar en tilbake til X.html. SVG-bilder som lenke kan gjøres slik: <a ...> <img src="høyrepil.svg"></a>
.
Å lage en pen pil i SVG kan ta noe tid, men du kan jo bare lage en sirkel, eller kopiere en pil fra Wikimedia (SVG-koden får du med Ctrl-U når du har SVG-fila i nettleseren, her er ei direktelenke til ei grønn pil kodet med SVG).
En CSS-generert høyrepil kan lages som her og legges i "stil.css".