Dynamiske websider med JavaScript og CSS3
|
|
- Sissel Ludvigsen
- 8 år siden
- Visninger:
Transkript
1 Dynamiske websider med JavaScript og CSS3 Skrevet av Atle Nes Avdeling for informatikk og e-læring Høgskolen i Sør-Trøndelag Denne leksjonen handler om å bruke JavaScript og ny funksjonalitet i CSS3 til å lage dynamiske og tilpasningsdyktige websider. Vi tar i denne leksjonen også utgangspunkt i at du har grunnleggende kjennskap til HTML sin DOM (Document Object Model), programmering av dynamiske websider med JavaScript, design med CSS (Cascading Style Sheets) og forstår samspillet mellom disse teknologiene. HTML5 og JavaScript JavaScript, eller ECMAScript som det formelt kalles, gjør at vi kan kjøre små biter programkode på websidene for å gjøre de mer levende. I den nye HTML5-standarden er JavaScript blitt definert som standard scriptspråk, dvs. det scriptspråket vi skal bruke for å få laget dynamiske websider på klientsiden. Når vi sier på klientsiden mener vi at websiden lastes ned til nettleseren (klienten) før JavaScript-koden blir utført. Det finnes også scriptspråk som utføres på tjeneren (PHP, ASP, JSP etc.), men de blir ikke omtalt i denne leksjonen. Det at JavaScript er blitt standard scriptspråk i HTML5 betyr i alle fall at vi ikke lenger behøver å ha med attributtet type i syntaksen for å definere hvilket språk som er benyttet. Nettleseren skal nå forstå dette automatisk. Selv om det ikke har vært standardisert har nok endel nettlesere hatt denne funksjonaliteten lenge. Tidligere skrev vi altså <script type="text/javascript">...</script> Dette kan nå forkortes til <script>...</script> CSS3 (Cascading Style Sheets versjon 3) CSS brukes som kjent til å definere layout og utseendet til elementene på websiden. CSS3 er tredje versjon og er av W3C delt opp i mange ulike dokumenter som kalles moduler. Hver modul legger til helt nye funksjoner eller bygger på funksjonalitet fra CSS2 (og sørger for at CSS3 er bakoverkopatibel med denne). Det er lansert over 50 ulike moduler, men pga. modulariseringen er både stabilitet og status på disse svært forskjellig. Tre av modulene, om Selectors, Namespaces og Color, fikk imidlertid status som W3C anbefaling i
2 JavaScript Selectors API Når skal få JavaScript til å manipulere et element i DOM-treet kan man bruke attrubuttene id, name og class for å finne fram til riktig element(er) på websiden. Da har du kanskje brukt noen innebygde funksjoner som heter getelementbyid() eller getelementsbytagname(), men du har muligens savnet en getelementsbyclassname()? getelementsbyclassname() Det nye JavaScript-API-et løser dette ved å innføre nettopp getelementsbyclassname() slik at du nå også kan skrive: var innlegg = document.getelementsbyclassname('mine_innlegg'); Dette vil legge en referanse til alle elementer med klasseattributtet (class="mine_innlegg") til i variabelen innlegg. Den videre JavaScript-koden vil kunne manipulere elementene på websiden som hører til disse innleggene. Du kan selvfølgelig også inkludere flere klasser i en og samme funksjon ved å skille klassenavnene med mellomrom: var innlegg = document.getelementsbyclassname('klasse1 klasse2'); Dette vil legge referanser til både elementer med klasse1 og klasse2 til variabelen innlegg. Eller du kan utføre nøsting av ulike funksjoner: var forste_innlegg = getelementbyid('hoved').getelementsbyclassname('mine_innlegg'); Dette vil lage en referanse til alle elementer med class=mine_innlegg i likhet med øverste eksempel, men til forskjell bare innenfor elementet på websiden som har id=hoved (dvs. ikke hele websiden). queryselectorall() og queryselector() Annen ny funksjonalitet i JavaScript-API-et gjør at vi nå også enkelt har mulighet til å referere til elementer som stemmer overens med en bestemt syntaks i CSS. Dersom vi vil lage en referanse til alle avsnitt på websiden med klassen warning og error kan vi bruke funksjonen queryselectorall() til å skrive det kommaseparert på følgende måte: var alerts = document.queryselectorall("p.warning, p.error"); Et annen mer avansert eksempel kan være dersom vi ønsker å manipulere en punktliste (uordnet liste). La oss tenke oss at vi skal gjøre en operasjon på annethvert element i listen. Da kan vi med bruk av queryselectorall() skrive: var elements = document.queryselectorall("ul li:nth-child(odd)"); 2
3 Legg merke til at vi har skrevet CSS-syntaks for å referere til oddetallselementene (første, tredje, femte osv.) i punktlisten. Om man bytter ut odd med even vil det naturligvis bli partallselementene som blir referert til i stedet for oddetallselementene. Eller dersom det holder å referere til første enkelttreff i dokumentet kan vi bruke queryselector() i stedet for queryselectorall(). Dersom man vil manipulere første element i dokumentet med id=minid kan man skrive: var el = document.queryselector("#minid"); Vi kan ta et mer avansert eksempel. Tenk deg at du ønsker å manipulere første celle i tabellen som har name=test. Følgende syntaks vil gjøre nettopp dette. var first_td = document.queryselector("table.test > tr > td"); Legg også merke til bruken av hakeparanteser (>) for å traversere DOM-treet ned til riktig element. Hovedforskjellen på queryselector() og queryselectorall() er altså om du skal referere til et eller flere elementer. CSS3 Selectors En selector i CSS fungerer på lignende måte som for JavaScript. Den definerer kriterier for å velge ut et eller flere elementer på websiden som en eller flere CSS-regler skal gjelde for. CSS1 Første versjon av CSS hadde bare noen få selectors. Dette ga blant annet mulighet for å velge elementer (E), underelementer av elementer (E F), elementer som tilhører en bestemt klasse (E.klassenavn), elementer med en bestemt id (E.idnavn), hyperlenker med ulik status (E:link og E:visited), elementer som blir manipulert av brukeren (E:active, E:hover og E:focus) og første linje eller bokstav i elementet (E::first-line og E::first-letter) Om vi for eksempel ønsker at teksten i alle div elementer med klassen «advarsel» skal være rød kan vi definere dette som en CSS-regel på følgende måte: CSS2 div.advarsel { color: red; CSS2 introduserte mange nye selectors. Vi fikk mulighet til å velge alle elementer (*), elementer basert på attributtverdi (E[foo], E[foo="bar"], E[foo~="bar"] og E[foo ="bar"]), første underelement (E:first-child), elementer i et bestemt språk (for eksempel fransk - E.lang(fr)), innhold før og etter et element (E::before og E::after), underelement direkte under et element (E > F) og elementet direkte etter et element (E + F). Du husker kanskje at vi har brukt en av disse i avsnittet om JavaScript, nemlig muligheten for å velge et underelement direkte under et annet element. Om vi for eksempel ønsker å fargelegge bakgrunnen i den første cella i alle tabeller blå kan vi skrive en CSS-regel på følgende måte: table.test > tr > td { background-color: #0000ff; 3
4 CSS3 CSS3 introduserer også mange nye selectors. Dette gir tre nye muligheter for å velge elementer basert på attributtverdi i tillegg til (E[foo], E[foo="bar"], E[foo~="bar"] og E[foo ="bar"] fra CSS2) E[foo^="bar"] E[foo$="bar"] E[foo*="bar"] Velger alle elementer hvor attributtet foo har attributtverdi som starter med tekststrengen «bar». Velger alle elementer hvor attributtet foo har attributtverdi som avsluttes med tekststrengen «bar». Velger alle elementer hvor attributtet foo har attributtverdi som inneholder tekststrengen «bar». CSS3 gir også mange nye muligheter for å velger elementer basert på strukturelle egenskaper (i tillegg til E:first-child fra CSS2) E:root E:nth-child(n) E:nth-last-child(n) E:nth-of-type(n) E:nth-last-of-type(n) E:last-child E:first-of-type E:last-of-type E:only-child E:only-of-type E:empty Velger rotelementet til dokumentet. Velger det n te underelementet direkte under et element. Velger det n te siste underelementet direkte under et element. Velger det n te elementet av en bestemt type. Velger det n te siste elementet av en bestemt type. Velger det siste underelementet direkte under et element. Velger det første elementet av en bestemt type. Velger det siste elementet av en bestemt type. Velger det eneste underelementet direkte under et element. Velger det eneste elementet av en bestemt type. Velger elementet som ikke har noen underelementer. De siste nye variantene av selectors er E:target Elementet som er målet for URI en. E:enabled og E:disabled UI-element som kan være slått på eller slått av. E:checked UI-element som kan være valgt (checkbox eller radiobutton). E:not(s) Velger elementet som ikke samsvarer med selector s. E ~ F Velger elementet etter et element (ikke nødvendigvis like etter). 4
5 Eksempel på bruk av nth-child På tide med et lite eksempel. Vi kan lage oss en liten tabell med oversikt over leksjonene i faget HTML5. Tabellen har to kolonner og 9 rader. Å fargelegge annenhver rad i en større tabell kan dramatisk heve lesbarheten til tabellen. Dette kalles sebrafargelegging og har tidligere blitt løst med class="alternate" eller tilsvarende. Med den nye nthchild-selectoren kan tabellen bli helt fri for bruk av klasser. Det holder faktisk å legge til følgende CSS-kode: tr:nth-child(2n+1) { background-color: lightgrey; 2n+1 vil gi bety rad 1 (=2*0+1), rad 3 (=2*1+1), rad 5 (=2*2+1), rad 7 (=2*3+1) etc. Om du vil fargelegge motsatt kan du skrive 2n i stedet. Om du vil slippe unna matematikken går det også an å skrive de mer folkelige ordene odd eller even i stedet for 2n+1 og 2n. tr:nth-child(odd) { background-color: lightgrey; Dersom du vil ha annen fargelegging enn sebrastriper må du bruke matematikken. Legg også merke til at Internet Explorer versjon 7 og 8 ikke støtter CSS3 nth-child. En vanlig løsning på dette er å bruke jquery-biblioteket sin nth-child som fungerer også på IE-platformen. 5
6 CSS3 Farger Modulen om farger var den første som ble en CSS3 anbefaling av W3C - 7. juni For å se hva som er nytt om farger tar vi først en titt på hvordan verden så ut før CSS3. CSS2.1 lot oss definere farger på seks ulike måter: 17 uilke fargenavn aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, orange, purple, red, silver, teal, white og yellow. p { color: aqua; Fargekode bestående av 6 heksadesimale tegn To tegn for rødt, to for grønt og to for blått i intervallet 00 til FF. p { color: #AE03FF; p { color: #663399; Fargekode bestående av 3 heksadesimale tegn Et tegn for rødt, et for grønt og et for blått i intervallet 0 til F. Dette er en forenkling av fargekoden ovenfor som kan brukes dersom man har de to tegnene er like som i siste eksempel ovenfor. p { color: #639; RGB-kode med 3 numeriske verdier En verdi for rødt, en for grønt og en for blått i intervallet 0 til 255. p { color: rgb(109, 22, 255); RGB-kode med 3 prosentverdier Prosentverdier mellom 0% og 100% i stedet for numeriske verdier. p { color: rgb(0%, 10%, 100%); Systemfarger Farger i henhold til operativsystemet. p { color: ButtonFace; OBS! Denne siste kategorien bør du ikke lenger bruke siden den er uønsket i CSS3. 6
7 CSS3 lar oss definere farger på hele åtte ulike måter. Fargenavn Antallet er økt fra 17 til 147! Du kan finne en oversikt over alle fargene på CSS3 løser også problemet med gray/grey ved at begge skrivemåtene er tillatt. p { color: peru; Opacity Mulighet for å definere transparens med verdier fra fullt transparent 0 (eller 0.0) til fullt ugjennomsiktig 1 (eller 1.0). Legg merke til at regelen gjelder for elementet og alle underelementer! p { opacity: 0.3; RGBA-notasjon med numeriske eller prosentverdier Samme som CSS2.1, men med transparens som egen parameter. Man bør inkludere begge formuleringene for å støtte også gamle nettlesere. p { color: rgb(100,66,255); color: rgba(100,66,255,0.5); p { color: rgb(10%,6%,20%); color: rgba(10%,6%,20%,1); HSL eller HSLA-notasjon Dette er en ny fargemodell som blir brukt av designere. For nettleserne hard et ingen betydning om du definerer fargen med RGB eller med HSL. Hue har numerisk verdi mellom 0 og 359, saturation og lightness har prosentverdi mellom 0% og 100%. Også her er det lurt å inkludere formulering for å støtte gamle nettlesere. p { color: rgb(85,0,128); color: hsl(280,100%,50%); p { color: rgb(85,0,128); color: hsla(280,100%,50%,0.5); 7
8 Media Queries I dag finner vi nettlesere i mobiltelefoner, nettbrett, fjernsynsapparater, spillkonsoller og sikkert mange andre forskjellige enheter. Det antas at surfing på andre enheter enn den personlige datamaskinen vil overta i løpet av noen få år. I dag utvikles nettsteder stort sett for bruk med mus og tastatur, men etterhvert vil det kanskje være mer aktuelt med touch-grensesnitt, støtte for håndholdte spillkontrollere etc. Oppsummert stilles vi ovenfor et problem der vi har mange ulike enheter med ulike egenskaper (for eksempel skjermstørrelse) og ulike grensesnitt for inndata. Mange selskaper i dag velger å utvikle et eget iphone-nettsted. Nettstedet tilpasses enheten perfekt med tanke på iphone sine egenskaper til skjermstørrelse, men hva om man besøker nettstedet med en annen mobiltelefon med annen skjermstørrelse? Hva om det dukker opp en ny populær enhet? Skal vi utvikle et nettsted for iphone, en for ipad, en for Android, en for Windows Phone, en for Symbian, og en for personlige datamaskiner etc. På et tidspunkt kan man spørre seg om ikke dette blir for alt for mye arbeid. Ville det ikke heller være lurere å lage et nettsted og la designet endre seg basert på enhetens egenskaper? CSS2.1 ga oss noen spinkle muligheter til å velge mellom ulike stilark ved å spesifisere medietype. Hvis du har kodet stilark for utskrift kjenner du nok til denne syntaksen fra head i HTML: <link rel="stylesheet" type="text/css" href="skjerm.css" media="screen" /> <link rel="stylesheet" type="text/css" href="utskrift.css" media="print" /> Selv om standarden definerer mange ulike medietyper har nettlesere og enheter aldri omfavnet denne delen av spesifikasjonen. Det gjør at vi stort sett bare finner igjen denne syntaksen når det er snakk om utskrift. I CSS3 har vi fått noe som heter Media Queries som tar dette et steg videre. Dette lar oss lage stilark ikke for en bestemt type enhet slik vi gjorde med media-attributtet, men for en enhet som har visse egenskaper. Vi kan skrive: <link rel="stylesheet" type="text/css" media="screen and (max-device-width: 480px)" href="mobil.css" /> Vi ser at dette inneholder to deler; først en mediatype som før og deretter en spesifikasjon av egenskap (mediafeature). Den horisontale bredden til enheten blir sjekket (max-device-width) og dersom den er mindre eller lik 480 piksler vil enheten benytte stilarket mobil.css. Utviklere har eksperimentert med websider som har sjekket skjermoppløsning tidligere ved å bruke JavaScript. Media Queries tilbyr imidlertid mer enn bare skjermoppløsning. Det er til og med mulig å teste flere egenskaper på samme linje: <link rel="stylesheet" type="text/css" media="screen and (max-device-width: 480px) and (resolution: 163dpi)" href="mobil.css" /> 8
9 Vi er faktisk heller ikke lenger bare begrenset til bare å definere dette som links. Dette kan gjøres direkte i CSS-filen ved screen and (max-device-width: 480px) {.column { float: none; eller ved url("mobil.css") screen and (max-device-width: 480px); Uansett alternativ vil resultatet bli det samme. Hvis test av egenskapen går gjennom vil den relevante CSS-koden bli utført på HTML-koden. I stedet for å tilpasse seg hver enkelt enhet som finnes lager man CSS som tilpasser seg egenskapene til enheten. Modulen om Media Queries er ikke ansett som ferdig av W3C, men fungerer på de fleste moderne nettlesere unntatt Internet Explorer. Det finnes et JavaScript bibliotek som du finner på som du kan bruke for å få støtte også på IEplattformen. Web ble lansert i CSS2 og har vært implementert på Internet Explorer siden versjon 5 (utrolig!). Implementasjonen i IE baserte seg på det proprietære formatet Embedded Open Type (.eot) og ingen andre nettlesere valgte å bruke dette formatet. Med lanseringen av Safari 3.1 kunne webutviklere begynne å bruke alle de lisensierte TrueType fontene (.ttf) og OpenType fontene (.otf) på sidene sine. For å bruke egne fonter på websiden må de deklareres { font-family: DeliciousRoman; src: url( font-weight: 400; Og vi kan bruke denne fonten i et avsnitt på siden: p { font-family: DeliciousRoman, Helvetica, Arial, sans-serif; Den største grunnen til at webfonter ikke har tatt webben med storm er lisensspørsmål. Eierne av disse skrifttypene tillater rett og slett ikke slik bruk. Vi kan si at dette på sett og vis litt gammeldags tankegang. På sikt kan man kanskje tenke seg et felles lager der skrifttypene ligger gratis tilgjengelig på samme måte som Google sitt AJAX-bibliotek - 9
10 Mulighet for flere bakgrunner CSS3 tillater webutviklere å ha flere bakgrunner samtidig ved å definere de som en kommaseparert liste. La oss se på et enkelt eksempel med to bakgrunner: #eksempel { width: 500px; height: 250px; background-image: url(sheep.png), url(betweengrassandsky.png); background-position: center bottom, left top; background-repeat: no-repeat; Vi har definert høyde og bredde (height og width), to bilder for bakgrunn (background-image), plassering av bakgrunnsbildene (background-position) og om de skal gjentas eller ikke (backgroundrepeat). Dette vil stilsette og transformere følgende HTML-kode: <div id="eksempel">this box has background images, the first a sheep (aligned to the bottom and center) and the second is a grass and sky background (aligned to the top-left corner).</div> Til en ganske stilig boks på websiden: 10
11 Andre JavaScript-funksjoner JavaScript har også fått ny funksjonalitet knyttet til blant annet: Lokal lagring (web storage) En utvidelse av dagens cookies (informasjonskapsler). Cookies kan bare brukes til å lagre små tekststrenger, mens lokal lagring kan brukes til å lagre flere MB med data. Canvas Det introduseres et eget API for å tegne på et område på websiden enten i 2D eller 3D (WebGL). Device access Mulighet for å bruke JavaScript til å kommunisere med GPS, akselerometer og annen maskinvare på enheten. Webskjema Dette er temaer som vi tar opp i andre leksjoner senere i kurset. Andre CSS3-funksjoner Det finnes flere andre CSS3-moduler som tilbyr annen funksjonalitet enn den som er beskrevet her. En full oversikt over de viktigste modulene og deres status i forhold til å oppnå W3C anbefaling finner du på CSS3 er i likhet med HTML5 ikke ferdigutviklet og det gjelder derfor å teste funksjonaliteten du ønsker å bruke opp mot de plattformer, enheter og nettlesere du vil at websiden skal fungere på. 11
OBLIG 1 - WEBUTVIKLING
OBLIG 1 WEBUTVIKLING Oppgave 1 Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Problemer med funksjonalitet / bruk Uoversiktlig side For
DetaljerCSS: Style nettsider Nybegynner
CSS: Style nettsider Nybegynner Web Introduksjon Nå skal vi lære å endre på stilen til nettsider. I denne oppgaven forventer vi at du har gjort HTML-oppgavene eller er litt kjent med HTML fra før av. I
DetaljerCSS: Style nettsider. Introduksjon. Skrevet av: Arve Seljebu
CSS: Style nettsider Skrevet av: Arve Seljebu Kurs: Web Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon Nå skal vi lære å endre på
DetaljerCASCADING STYLESHEETS (CSS)
CASCADING STYLESHEETS (CSS) HVA ER CSS Stylesheets er en metode for å flytte selve formatteringen av et HTML dokument ut av selve dokumentet og over i et eksternt regelsett. Dette skyldes HTMLs manglende
DetaljerWeb fundamentals. Web design. Frontend vs. Backend 17.01.2008. Webdesign 17. januar 2008 3. Monica Strand
Web fundamentals Webdesign 17. januar 2008 Monica Strand Webdesign 17. januar 2008 1 Web design Fagområdet Web design inneholder flere disipliner Grafisk design Informasjonsdesign Brukergrensesnittdesign
DetaljerCSS. Aud Marie Hauge ekspert i brukskvalitet og universell utforming i Epinova AS
CSS Aud Marie Hauge ekspert i brukskvalitet og universell utforming i Epinova AS CSS står for Cascading Style Sheets CSS blir brukt til å bestemme hvordan HTML-elementene skal se ut (farge, størrelse,
DetaljerLa oss gjøre nettsiden vår bedre med noen stiler. I denne og den neste leksjonen skal vi lære hvordan man endrer farge, tekst, størrelser og mer!
Lesson 4 CSS All Code Clubs must be registered. Registered clubs appear on the map at codeclub.org.uk - if your club is not on the map then visit jumpto.cc/18cplpy to find out what to do. Introduksjon
DetaljerHåkon Tolsby. 25.08.2014 Håkon Tolsby
HTML5 og CSS Håkon Tolsby 25.08.2014 Håkon Tolsby 1 En webside min webside en html5 side dett er min første
DetaljerEKSAMEN Webpublisering
Høgskolen i Telemark Fakultet for allmennvitenskapelige fag EKSAMEN 6101 Webpublisering 03.12.2015 Tid: Målform: Sidetal: 3 timer Bokmål 5 (inkludert denne) Hjelpemiddel: Ingen Merknader: Alle oppgavene
DetaljerOppgave 1 (Etter forelesning 31/8) Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
Oblig 1 Oppdatert: 10/09 Nye oppgaver Oppgave 1 (Etter forelesning 31/8) Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Oppgave 2 (Etter
DetaljerOBLIG 2 WEBUTVIKLING
OBLIG 2 WEBUTVIKLING Oppgave 1 Design ved hjelp av skisser eller wireframes et nettsted med et "avansert" design. Lag spesifikke design for ulike skjermstørrelser og utskrift. Fokuser spesielt på å få
Detaljer- reklamebannere mobil og tablet
Spesifikasjoner - reklamebannere mobil og tablet FINN.no Versjon 2.4 Sist oppdatert 16.08.2013 1. Innhold Innhold Introduksjon Målsetning Spesifikasjoner HTML Fysisk størrelse 225 px* Eksempler Størrelser
DetaljerOblig 1 Erlend Hannestad
Oblig 1 Erlend Hannestad Oppgave 1 Nettsiden er ustrukturert og uryddig når det kommer til layout og design, det er vanskelig å holde oversikt over alt som vises på siden, det er rett og slett for mye
DetaljerCSS-formatering: stilark med kommentarer
CSS-formatering: stilark med kommentarer /* Demonstrasjon av stilarkregler. Jeg har satt inn forslag til farger og fonter, men du setter inn dine egne valg selvfølgelig. */ /* Stilregler for html-taggen
DetaljerJavascript. Mer om layout
Javascript. Mer om layout Kirsten Ribu 04.10.04 Kirsten Ribu - Webpublisering - HiO -2004 1 Men først. Hvordan går det med klasser og blokker? Hjalp det med mailene? Litt mer om klasser og blokker ;-)
DetaljerMMT105 Internettprogrammering Uke 44, høst 2007
MMT105 Internettprogrammering Uke 44, høst 2007 Introduksjon til CSS MMT105 HiNT 2007 1 HTML-elementenes strukturerende egenskaper HTML-elementene skal markere strukturen i et webdokument, dvs. at de forskjellige
DetaljerSteg 1: Vi starter fra toppen
CSS: Layout Skrevet av: Lars Klingenberg Kurs: Web Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon Målet med oppgaven er å lære hvordan
DetaljerSUKKERGRIS. Anita og Silje DAT100
SUKKERGRIS Anita og Silje DAT100 I NNHOLD 1. Innledning... 2 2. Beskrivelse av Sukkergris... 3 2.1 Struktur og grafisk design... 3 2.1.1 Sidens oppbygning... 3 2.1.2 CSS og Grafisk design... 4 2.2 Oversikt
Detaljerpraktiske eksempler DOM Document Object Model DOM og Høst 2013 Informasjonsteknologi 2 Læreplansmål Gløer Olav Langslet Sandvika VGS
DOM og praktiske eksempler Gløer Olav Langslet Sandvika VGS Høst 2013 Informasjonsteknologi 2 DOM Document Object Model Læreplansmål Eleven skal kunne programmere med enkle og indekserte variabler eller
DetaljerTENK TECH SUMMERCAMP BYGG DIN EGEN NETTSIDE
TENK TECH SUMMERCAMP BYGG DIN EGEN NETTSIDE JULIE HILL ROA MIRA THOEN FEIRING HVA ER WEBUTVIKLING? SERVER KLIENT HTTP request HTML, CSS, JavaScript HTTP response HTML Innhold CSS Utseende JAVASCRIPT Oppførsel
DetaljerINF1040 Oppgavesett 4: CSS
INF1040 Oppgavesett 4: CSS (Kapittel 5) Fasitoppgaver Ingen fasitoppgaver denne gang. Se flervalgsoppgavene under. Flervalgsoppgaver I følgende oppgaver er det oppgitt fem alternativer der nøyaktig ett
DetaljerHåkon Tolsby Håkon Tolsby
HTML5 og CSS Håkon Tolsby 27.08.2018 Håkon Tolsby 1 En webside min webside en html5 side dett er min første
Detaljer(X)HTML, CSS og JavaScript HTML. Det første dokumentet 26.11.2007. Grunnleggende programmering i Java Monica Strand 26.
(X)HTML, CSS og JavaScript Grunnleggende programmering i Java Monica Strand 26. november 2007 Gr. leggende Java 26. november 2007 1 HTML HTML = Hyper Text Markup Language Strukturerer tekstinnhold HTML
DetaljerSteg 1: Animasjons-attributtet
CSS: Animasjon Skrevet av: Lars Klingenberg Kurs: Web Tema: Tekstbasert, Nettside, Animasjon Fag: Matematikk, Programmering, Kunst og håndverk Klassetrinn: 5.-7. klasse, 8.-10. klasse, Videregående skole
DetaljerOppgave 1. Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
Oppgave 1 Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Når man tar pilen over fanene, dukker det opp utrolig mange tagger. Dvs alt er
Detaljer"Dette skjer når jeg trykker på denne knappen" "Når jeg skriver i dette feltet, ser jeg at det andre forandrer seg"
Tegning med SVG Skrevet av: Teodor Heggelund Kurs: Elm Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon I denne oppagaven skal vi lære
DetaljerOppgave 1: Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
Oppgave 1: Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Svar: Ved første øyekast har utvikleren av nestesiden plasser altfor mange div
Detaljernotater Gule lapper Mine Et praktisk eksempel med objekter IT2 Læreplansmål Gløer Olav Langslet Sandvika VGS
Mine notater Gløer Olav Langslet Sandvika VGS Et praktisk eksempel med objekter Vi kjenner alle til korktavlen med gule lapper. Vi henger opp en lapp for at vi selv eller andre skal huske eller bli minnet
DetaljerCSS: Animasjon Nybegynner
CSS: Animasjon Nybegynner Web Introduksjon I denne oppgaven skal du lære å animerer HTML-objekter ved hjelp av CSS. Under ser du hvordan resultatet vil bli til slutt: Men før vi starter å lage animasjonen
Detaljer1. Cascading Style Sheet (CSS)
Avdeling for informatikk og e-læring, Høgskolen i Sør-Trøndelag Lene Hoff 18.7.2007 Lærestoffet er utviklet for faget LN515D XML Teknologi 1. Resymé: I denne leksjonen skal vi ta for oss CSS (Cascading
DetaljerHTML: Del inn nettsiden
HTML: Del inn nettsiden Erfaren Web Introduksjon Målet med denne oppgaven er å lære hvordan man kan organisere en nettside ved å dele den inn med forskjellige tagger. Dersom du ikke er kjent med tagg-strukturen
DetaljerI denne oppgaven forventer vi at du har vært gjennom HTML- og CSS-oppgavene så langt og/eller er kjent med <div> - og HTML5-taggene.
CSS: Layout Ekspert Web Introduksjon Målet med oppgaven er å lære hvordan man lager en nettside med en meny og et innholdsfelt. I denne oppgaven forventer vi at du har vært gjennom HTML- og CSS-oppgavene
Detaljer1. Intro om SharePoint 2013
Avdeling for informatikk og e-læring, Høgskolen i Sør-Trøndelag Intro om SharePoint 2013 Stein Meisingseth 09.08.2013 Lærestoffet er utviklet for faget LO205D Microsoft SharePoint 1. Intro om SharePoint
DetaljerHTML-del. 1. <!-- ikke slett min kode, vær så snill --> er a) en HTML stil-tag b) en CSS stil-tag c) en HTML kommentar-tag d) en CSS kommentar-tag
HTML-del 1. er a) en HTML stil-tag b) en CSS stil-tag c) en HTML kommentar-tag d) en CSS kommentar-tag 2. Grafisk elementer på web skal være a) 72 ppi b) 144
DetaljerHøgskolen i Telemark EKSAMEN Webpublisering (inkludert denne) Hjelpemiddel: Ingen
Høgskolen i Telemark Fakultet for allmennvitenskapelige fag EKSAMEN 6101 Webpublisering 05.12.2013 Tid: Målform: Sidetal: 3 timer Bokmål 7 (inkludert denne) Hjelpemiddel: Ingen Merknader: Alle oppgavene
DetaljerSteg 1: Canvas-elementet
JS: Partikkel-animasjon Skrevet av: Lars Klingenberg Kurs: Web Tema: Tekstbasert, Nettside, Animasjon Fag: Matematikk, Programmering Klassetrinn: 5.-7. klasse, 8.-10. klasse, Videregående skole Introduction
Detaljerfile:///c:/users/michaelp/sites/dkdm/dw6/dreamweaver6.html
1 of 9 15.04.2015 14:15 Spry og behaviours Både Spry and Behaviours er basert på programmeringsspråket Javascript. Javascript kjører i nettleseren og ikke på webserver som PHP og Perl. På en lignende måte
DetaljerEKSAMEN Web-publisering
EKSAMEN 6101 Web-publisering 02.06.2016 Tid: Målform: Sidetall: 3 timer Bokmål 5 (inkludert denne) Hjelpemiddel: Ingen Merknader: Vedlegg: Alle oppgavene er vektet, pass på å fordele tiden du bruker mellom
DetaljerOBLIG 1 WEBUTVIKLING. Oppgave 1 Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
OBLIG 1 WEBUTVIKLING Oppgave 1 Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Tar lang tid å laste inn siden: Mye bilder Mange animasjoner
DetaljerOppsummering fra forelesning 2
1 of 16 02.04.2015 15:42 Oppsummering fra forelesning 2 Lenker Lenker er, historisk sett, webens første eksistensberettigelse Lenker kan være relative (går til sider innenfor samme nettsted) eller absolutte
Detaljer1. XHTML. Innhold Innledning
Avdeling for informatikk og e-læring, Høgskolen i Sør-Trøndelag XHTML Lene Hoff 19.9.2006 Lærestoffet er utviklet for faget XML Teknologi 1. XHTML Resymé: I denne leksjonen skal vi ta for oss standarden
DetaljerI denne oppgaven skal du lære hvordan du kan flytte rundt på elementer og gjemme elementene bak andre elementer ved hjelp av CSS.
CSS: Skjul ninjaene Skrevet av: Oversatt fra Code Club UK (//codeclub.org.uk) Oversatt av: Trude Martinsen Kurs: Web Tema: Tekstbasert, Nettside Fag: Matematikk, Programmering, Teknologi, Kunst og håndverk
Detaljerog bevegelse funksjoner som blir aktivert av hendelser Keyboard Informasjonsteknologi 2 Læreplansmål Gløer Olav Langslet Sandvika VGS
Keyboard og bevegelse Gløer Olav Langslet Sandvika VGS 12.09.2012 Informasjonsteknologi 2 funksjoner som blir aktivert av hendelser Læreplansmål Eleven skal kunne programmere med enkle og indekserte variabler
DetaljerKursdokumentasjon for Dreamweaver
Kursdokumentasjon for Dreamweaver Skrevet av 2/13 1 Komme i gang med Dreamweaver... 3 2 Bruk av Dreamweaver... 4 2.1 Verktøylinja...5 2.2 Properties... 5 3 Sidens egenskaper... 6 4 Tekst... 7 4.1 Endre
DetaljerMer om stiler og stilark. Layout. Litt Design
Mer om stiler og stilark. Layout. Litt Design Webpublisering 13.09.2004 Webpublisering - HiO - Kirsten Ribu - 2004 1 I dag Struktur på hjemmesiden Mer om stiler Stiler og layout Litt om design og farger
DetaljerOblig 1 Webutvikling av Jon-Håkon Rabben
Oblig 1 Webutvikling av Jon-Håkon Rabben Oppgave 2 og 3) http://www.it-stud.hiof.no/~jhrabben/boxmodel.html Oppgave 6) http://www.it-stud.hiof.no/~jhrabben/oblig1oppg6.html Oppgave 1) Siden tar lang tid
DetaljerBrukermanual til Domenia Norges adminløsning
Brukermanual til Domenia Norges adminløsning 1. Login For å logge inn på løsningen din skriver du inn domenenavnet ditt og /siteadmin (f.eks www.domenia.no/siteadmin ). Skriv inn brukernavn og passord
DetaljerFarger. Introduksjon. Skrevet av: Sigmund Hansen
Farger Skrevet av: Sigmund Hansen Kurs: Processing Tema: Tekstbasert Fag: Matematikk, Programmering, Kunst og håndverk Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon På skolen lærer man om
Detaljerlagring med HTML5 Offline lagring Offline Informasjonsteknologi 2 Gløer Olav Langslet Sandvika VGS
Offline lagring med HTML5 Gløer Olav Langslet Sandvika VGS Leksjon 8 Informasjonsteknologi 2 Offline lagring I IT1 brukte vi databaser til å lagre data. Der kunne vi bygge tabeller og fylle dem med innhold
DetaljerI denne oppgaven blir du introdusert for programmeringsspråket JavaScript. Du skal gjøre den klassiske oppgaven Hei verden, med en katt.
JS: Hei JavaScript! Skrevet av: Arve Seljebu Kurs: Web Tema: Tekstbasert, Nettside Fag: Programmering Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon I denne oppgaven blir du introdusert for
DetaljerI denne oppgaven blir du introdusert for programmeringsspråket JavaScript. Du skal gjøre den klassiske oppgaven Hei verden, med en katt.
Hei JavaScript! Introduksjon Web Introduksjon I denne oppgaven blir du introdusert for programmeringsspråket JavaScript. Du skal gjøre den klassiske oppgaven Hei verden, med en katt. Steg 1: Bruke JS Bin
DetaljerHøgskoleni østfold EKSAMEN
Høgskoleni østfold EKSAMEN Emnekode: Emne: ITF10511 Webutvikling Dato: Eksamenstid: 03/12-2014 09.00-13.00 Hjelpemidler: Faglærer: In en Tom Heine Nått Eksamensoppgaven: Oppgavesettet består av 6 sider
DetaljerOblig 3 Webutvikling. Oppgave 1
Oblig 3 Webutvikling Oppgave 1 Ta for deg en selvvalgt bedrift (gjerne lokal/mindre) og tenk deg at du hadde fått i oppgave å være en SEOkonsulent for disse i én uke. På denne uken skulle du gjennomført
DetaljerStyling og formatering av tekst
Lesson 5 All Code Clubs must be registered. Registered clubs appear on the map at codeclub.org.uk - if your club is not on the map then visit jumpto.cc/18cplpy to find out what to do. Styling og formatering
Detaljerfile:///c:/users/michaelp/sites/dkdm/dw5/dreamweaver5_1.html
1 of 10 09.04.2015 15:49 Fra forrige gang: Om tabeller Tabeller er i utgangspunktet en måte å presentere data på. Skal ikke brukes for å legge ut sider Dreamweaver har fasiliteter for å opprette, redigere
DetaljerWebutvikling oblig 1 Marius Hanssen
Webutvikling oblig 1 Marius Hanssen Oppgave 1 arngren.net er en rotete nettside, enkelt sett forpestet med et uorganisert layout og en kode så grov at jeg ikke skjønner hvordan de klarte å finne en så
DetaljerOblig 5 Webutvikling. Av Thomas Gitlevaag
Oblig 5 Webutvikling Av Thomas Gitlevaag For oppgave 1 og 2 skal dere levere en funksjonell webside på deres hjemmeområde. Dere skal også levere alle phps-filene slik at man for en hver side kan slenge
DetaljerTilpassning av Wordpress - Enterprise Theme
Del 2 - Tilpassning Tilpassning av Wordpress - Enterprise Theme Del 1 var en gjennomgang av hvordan man setter opp det tekniske som kreves for å kjøre en Wordpress webside/blogg. Installere webserver (Apache)
DetaljerBildebehandling i GIMP
Bildebehandling i GIMP 9.1 Opprette et dokument & 9.2 Bildestørrelse For å opprette et nytt dokument velger du File > New (Fil > Ny...) Da vil følgende vindu dukke opp: Her er bildets oppløsning satt til
DetaljerLæringsmål og pensum. Hvordan virker webteknologi? (klient-tjener arkitektur) HTML - virkemåte. Nettleser: Firefox, Opera, Safari
1 2 Læringsmål og pensum TDT4105/4110 Informasjonsteknologi grunnkurs: Uke 35/36 HTML Førsteamanuensis Alf Inge Wang Læringsmål Lære å lage statiske hjemmesider Bilder Lenker Lister Tabeller Skjema for
DetaljerAdministrering av SafariSøk
Administrering av SafariSøk Administrering av SafariSøk Revisjonshistorie Revisjon $Revision: 1.6 $ $Date: 2003/08/05 12:44:02 $ Innholdsfortegnelse 1. Om programmet... 1 Generelt... 1 2. Fremgangsmåter...
DetaljerInnføring i Dynamisk HTML
Innføring i Dynamisk HTML Her kommer en enkel innføring i dynamisk HTML (DHTML). DHTML er en webside (et web dokument) som kan endres etter at den er lastet inn i webleseren. Når brukeren fører musepekeren
DetaljerNCE TOURISM FJORD NORWAY. FJORDNETT INTERNETTFORUM 2012 Bergen, 12./13. juni 2012
NCE TOURISM FJORD NORWAY FJORDNETT INTERNETTFORUM 2012 Bergen, 12./13. juni 2012 HACKERS HOUR Hvor langt kommer vi med FjordNett rammeverket? Html CSS Javascript Hva er bestanddelene av en nettside? Html
DetaljerHTML5 og CSS3. - Fremtiden på web: struktur, semantikk og styling. christine.lund@evita.no. Yggdrasil, Tønsberg - 12.10.2010
HTML5 og CSS3 - Fremtiden på web: struktur, semantikk og styling christine.lund@evita.no Yggdrasil, Tønsberg - 12.10.2010 Christine Lund Enterprise 2.0: konsulent, teamleder, fagansvarlig Kort introduksjon
DetaljerOblig 1. Oppgave 1. Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
Oblig 1 Oppgave 1 Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Problemer med arngren.net: 1. Nettsiden er SYKT uoversiktlig! 2. Det er
DetaljerBilder, tabeller. Kirsten Ribu 26.09
Bilder, tabeller Kirsten Ribu 26.09 1 Repetisjon: div taggen Blokker () Et (X)HTML-dokument kan deles inn i blokker med og hver blokk må avsluttes med . Blokker benyttes i dokumenter der
DetaljerJS: Partikkel-animasjon Nybegynner
JS: Partikkel-animasjon Nybegynner Web Introduction I denne oppgaven skal vi bruke JavaScript til å få figurer vi å bevege seg. Vi skal altså lære å animere ved hjelp av JavaScript og noe som heter Canvas.
DetaljerStilark Cascading Style Sheets - CSS
Stilark Cascading Style Sheets - CSS /* Eksempel på stilark */ h1 { text-align: center; color: blue; } Læreboka kapittel 5 12. september 2007 INF1040-CSS-1 Boks-modellen Et XHTML-dokument er satt sammen
DetaljerStilark Cascading Style Sheets - CSS
Stilark Cascading Style Sheets - CSS /* Eksempel på stilark */ h1 { text-align: center; color: blue; } Læreboka kapittel 5 12. september 2007 Boks-modellen Et XHTML-dokument er satt sammen av elementer
DetaljerSkrevet av: Oppgaven er laget av GDG Bergen ( AU/GDGBergen/), og tilpasset Kodeklubbens format på oppgaver.
Space invaders Skrevet av: Oppgaven er laget av GDG Bergen (https://www.meetup.com/en- AU/GDGBergen/), og tilpasset Kodeklubbens format på oppgaver. Oversatt av: Teodor Heggelund og Stein Olav Romslo Kurs:
DetaljerPresentasjon av hovedprosjekt ved HIST Nettbutikk www.midt-svartdal.no
Presentasjon av hovedprosjekt ved HIST Nettbutikk www.midt-svartdal.no Hovedprosjekt 2008 av Audun M. Solheim, student HIST/BAIN, audun@c2i.net Oppdragsgiver:Bjørg Minnesjord Solheim, bjorg@midt-svartdal.no
DetaljerGEO2311. Obligatorisk Innlevering 1
GEO2311 Obligatorisk Innlevering 1 STUDENTER: Kia Simonsen Morten Kappelslåen Gjøvik, 14.10.2015 Side 1 av 11 Innholdsfortegnelse Introduksjon... 3 Del 2 - HTML delen... 4 Del 2 - CSS delen... 9 Del 3
DetaljerI denne oppgaven blir du introdusert for programmeringsspråket JavaScript. Du skal gjøre den klassiske oppgaven Hei verden, med en katt.
JS: Hei JavaScript! Introduksjon Web Introduksjon I denne oppgaven blir du introdusert for programmeringsspråket JavaScript. Du skal gjøre den klassiske oppgaven Hei verden, med en katt. Steg 1: Bruke
DetaljerNy på nett. Operativsystemer
Ny på nett Operativsystemer Hva skal vi lære? Hva er et operativsystem? Ulike typer operativsystemer XP Vista Windows 7 Skrivebordet Min datamaskin Start-knappen Papirkurv/søppelkurv Internett explorer
DetaljerCSS: Endre utseende og stil på tekst Nybegynner
CSS: Endre utseende og stil på tekst Nybegynner Web Introduksjon I denne oppgaven skal vi jobbe videre med skrift, størrelser og farger. Vi skal utforske forskjellige skrifttyper, se på bakgrunnsfarger
DetaljerBrukerdokumentasjon for LabOra portal - forfattere
Brukerdokumentasjon for LabOra portal - forfattere Skin: Dnnbest-Grey-Skin1024 Skin: Metro7 Custom LabOra web-portal er et web-basert publiseringsprogram for publisering av informasjon på hjemmesider.
DetaljerHTML5. Skjemaer på nettsider. Skjemaer med. Informasjonsteknologi 1 og 2. Gløer Olav Langslet Sandvika VGS
Skjemaer med HTML5 Gløer Olav Langslet Sandvika VGS Leksjon 10 Informasjonsteknologi 1 og 2 Skjemaer på nettsider I denne leksjonen skal vi se litt nærmere på bruk av skjemaer på nettsider. Du har sett
DetaljerCSS. Animasjon med css. Animasjon med. Informasjonsteknologi 1 og 2. Gløer Olav Langslet Sandvika VGS
Animasjon med CSS Gløer Olav Langslet Sandvika VGS Leksjon 11 Informasjonsteknologi 1 og 2 Animasjon med css Vi har tidligere sett at vi kan programmere bevegelse ved å bruke JavaScript, enten ved å bruke
DetaljerHer er en enkel bruksanvisning på administrasjonspanelet til hjemmesiden din på QTSystems.
Her er en enkel bruksanvisning på administrasjonspanelet til hjemmesiden din på QTSystems. Redigert 10.februar 2010. For at det skal bli lettere å lese denne manualen kan du justere størrelsen på dette
DetaljerKOM I GANG MED WORDPRESS En enkel guide for å hjelpe deg gjennom det grunnleggende i Wordpress
KOM I GANG MED WORDPRESS En enkel guide for å hjelpe deg gjennom det grunnleggende i Wordpress Sist oppdatert 05.06.2015 Innholdsfortegnelse 1. Hva er Wordpress?... 3 2. Hvordan logger jeg inn i kontrollpanelet?...
Detaljerwww.lakselvdal.no Brukerkurs 16.februar 2012
Brukerkurs 16.februar 2012 Kort introduksjon til world wide web og struktur der. Forskjellige måter å lage seg en hjemmeside på. Hvordan vi i Lakselvdal gjør det. Og viktigst av alt, utdanne flere til
Detaljermed canvas Canvas Grafikk Læreplansmål Gløer Olav Langslet Sandvika VGS
Grafikk med canvas Gløer Olav Langslet Sandvika VGS Høsten 2011 Informasjonsteknologi 2 Canvas Læreplansmål Eleven skal kunne bruke programmeringsspråk i multimedieapplikasjoner Med CSS3, HTML og JavaScript
DetaljerSENSORVEILEDNING. Dato: Eventuelt:
SENSORVEILEDNING Emnekode: ITF10511 Emnenavn: Eksamensform: Webutvikling Digital Dato: 03.12.2018 Faglærer(e): Michael A. Lundsveen Eventuelt: Læringsutbytte for emnet KUNNSKAP: Studenten kan forstå nettsteders
DetaljerTestrapport Prosjekt nr. 2011-22 Det Norske Veritas
Prosjekt nr. 2011 22 Testrapport Hovedprosjektets tittel Implementering av plugin og utvikling av wizard for Det Norske Veritas Prosjektdeltakere Magnus Strand Nekstad s156159 Jørgen Rønbeck s135779 Dato
DetaljerEKSAMEN / 6101N WebPublisering
EKSAMEN 6101 / 6101N WebPublisering 09.12.2016 Tid: Målform: Antall sider: 3 timer Bokmål 8 (inkludert denne) Hjelpemidler: Ingen Merknader: Vedlegg: Alle oppgavene er vektet, pass på å fordele tiden du
DetaljerTell sekunder. Introduksjon. Skrevet av: Teodor Heggelund. I denne oppgaven skal vi lage vårt eget spill!
Tell sekunder Skrevet av: Teodor Heggelund Kurs: Elm Tema: Tekstbasert, Nettside, Spill Fag: Programmering, Teknologi Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon I denne oppgaven skal vi
DetaljerBORRENYTT. Dette er en innføringsguide om hvordan man kan legge til nye poster, og hvordan disse bør settes opp.
Dette er en innføringsguide om hvordan man kan legge til nye poster, og hvordan disse bør settes opp. I denne guiden skal jeg ta for meg hvordan man kan legge til eller endre tekst, opprette nyheter og
DetaljerHTML: Legg til lyd og video
HTML: Legg til lyd og video Skrevet av: Oversatt fra Code Club UK (//codeclub.org.uk) Oversatt av: Trude Martinsen Kurs: Web Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi, Norsk Klassetrinn:
DetaljerJSP - 2. Fra sist. Hvordan fungerer web? Tjenerside script HTML. Installasjon av Web-tjener Et enkelt JSP-script. Ønsker dynamiske nettsider:
Fra sist JSP - 2 Installasjon av Web-tjener Et enkelt JSP-script HTML statisk Forms Tags Ønsker dynamiske nettsider: Klientside-script/programmering Javascript, vbscript, applets Tjenerside-script/programmering
DetaljerEKSAMEN. Elektronisk publisering. INNFØRING MED PENN, evt. trykkblyant som gir gjennomslag
Høgskolen i Gjøvik KANDIDATNUMMER: EKSAMEN FAGNAVN: FAGNUMMER: Elektronisk publisering L101G EKSAMENSDATO: 04.01.01 KLASSE: TID: FAGLÆRER: ANTALL SIDER UTLEVERT: TILLATTE HJELPEMIDLER: 99hinga/b, 99hdmua/b
DetaljerModell, meldinger og oppdatering
Input fra brukeren Skrevet av: Alexander Perry Kurs: Elm Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon Input-felter lar brukere skrive
DetaljerKomme igang med App Inventor Introduksjon App Inventor PDF
Komme igang med App Inventor Introduksjon App Inventor PDF Introduksjon Dette er en introduksjon til MIT App Inventor, hvor du skal lære å lage applikasjoner til Android. Å lage apps i App Inventor er
DetaljerWINDOWS 10 OPPDATERING HØSTEN 2018 (VERSJON 18.09) HVA ER NYTT?
WINDOWS 10 OPPDATERING HØSTEN 2018 (VERSJON 18.09) HVA ER NYTT? For å finne ut hvilken versjon av Windows 10 en har på sin PC kan du finne ut ved å gjør følgende: 1. Klikk på Startknappen og velg Innstillinger.
DetaljerEn bedre verden med AJAX
En bedre verden med AJAX Frode Eika Sandnes Hva er AJAX Har ikke noe med rengjøringsmidler å gjøre AJAX er et (morsomt) akronym Asynchronous Javascript And XML Henskikt: lage interaktive webapplikasjoner
DetaljerInstallasjon av Nett-TV-meter Trinn for trinn
Installasjon av Nett-TV-meter Trinn for trinn Nett-TV-meter tilpasset for Windows og OS X (Mac). I dette dokumentet finner du fremgangsmåten for installasjonen av Nett-TV-meter. I e-posten du/dere har
Detaljer1. Lage og vise et enkelt XML-dokument
Avdeling for informatikk og e-læring, Høgskolen i Sør-Trøndelag Lage og vise et enkelt XML-dokument Lene Hoff (revidert av Tore Mallaug) 1.9.2013 Lærestoffet er utviklet for faget XML Teknologi 1. Lage
DetaljerFor å sjekke at Python virker som det skal begynner vi med å lage et kjempeenkelt program. Vi vil bare skrive en enkel hilsen på skjermen.
Kuprat Skrevet av: Geir Arne Hjelle Kurs: Python Tema: Tekstbasert Fag: Norsk Klassetrinn: 5.-7. klasse, 8.-10. klasse Introduksjon I dette kurset skal vi introdusere programmeringsspråket Python. Dette
DetaljerEndre utseendet på nytt grensesnitt med Primo Studio
Endre utseendet på nytt grensesnitt med Primo Studio Ex Libris har lansert en ny funksjonalitet sommeren 2018 som gjør det lettere å tilpasse grensesnittet og se endringene live. Endringene har ingen virkning
DetaljerForprosjekt gruppe 13
Forprosjekt gruppe 13 Presentasjon Tittel: Oppgave: Periode: Gruppemedlemmer: Veileder: Oppdragsgiver: Kontaktperson: Mobilbillett i HTML5 Utvikle en mobil billettautomat innenfor kategorien dedikert web
DetaljerVanlige spørsmål om EndNote (april 2013)
Vanlige spørsmål om EndNote (april 2013) Her er svar på en del vanlig spørsmål og problemer som kan dukke opp når du arbeider med EndNote. Innhold Import av referanser... 1 Hvis EndNote låser seg:... 2
Detaljer