Visa och dölja element med JavaScript

Storlek: px
Starta visningen från sidan:

Download "Visa och dölja element med JavaScript"

Transkript

1 Föreläsning i webbdesign Visa och dölja element med JavaScript Rune Körnefors Medieteknik Rune Körnefors

2 Visa och dölja element Förändra elementets sdl för display eller visibility display="block" display="hidden" visibility="visible" visibility="hidden" 2

3 Visa/dölja e8 element med display HTML- och CSS- kod: <div id="b"> </div> #b {display:none;} Visas som en del av sidans innehåll JavaScript- kod: Referens: var element = document.getelementbyid("b"); Visa: element.style.display = "block"; (eller element.style.display = "inline"; eller något annat, beroende på hur taggen ska visas.) Dölj: element.style.display = "none"; 3

4 Exempel: Expanderbar meny En innehållsförteckning (meny) har eb antal undermenyer som kan expanderas I det första exemplet visas eller döljs undermenyn genom ab klicka på dess rubrik. Alla undermenyer kan visas samddigt. I det andra exemplet visas undermenyn genom ab klicka på dess rubrik. Den kan dock inte döljas igen. Istället döljs den, då man klickar på rubriken för en annan undermeny. Alltså kan endast en undermeny åt gången visas. ex3-1" ex3-2" I det tredje exemplet kombineras de båda föregående. Endast en meny åt gången kan visas, men det går också ab dölja den meny som visas genom ab klicka på dess rubrik. ex3-3" HTML- och CSS- kod är densamma i alla tre fallen. Det enda som skiljer exemplen åt är funkdonen showhidemenu. 4

5 Exempel: Menyn med annan layout! Samma föregående exempel, fast med en annan layout HTML- och JavaScript- koden är exakt densamma som i ex3-3 Endast Dllägg av några sdlar i sdlmallen, för ab ändra sdl för menyerna ex4" 5

6 Visa/dölja e8 element med visibility Med reladv posidonering Visas som en del av sidans innehåll HTML- och CSS- kod: <div id="b"> </div> #b {posidon:reladve; visibility:hidden;} JavaScript: Referens: var element = document.getelementbyid("b"); Visa: element.style.visibility = "visible"; Dölj: element.style. visibility = "hidden"; 6

7 Exempel: Meny med visibility Samma kod som i exempel 4, med den skillnaden ab visibility används istället för display. ex5" Ändringar från display Dll visibility både i JavaScript- koden och CSS- koden 7

8 Visa/dölja e8 element med visibility Med absolut posidonering Visas i eb lager framför övrigt innehåll på sidan HTML- kod: <div id="b"> </div> #b {posidon:absolute; visibility:hidden;} JavaScript: Referens: var element = document.getelementbyid("b"); Visa: element.style.visibility = "visible"; Dölj: element.style. visibility = "hidden"; 8

9 Visa/dölja e8 element med visibility Med absolut posidonering inom eb block HTML- och CSS- kod: <div id= a > <div id= b > < > </div> </div> JavaScript: Referens: var element = document.getelementbyid( b ); Visa: element.style.visibility = visible"; Dölj: element.style.visibility = hidden"; #a {posidon:reladve;} #b {posidon:absolute; visibility:hidden;} PosiDoneras inom det omgivande blocket 9

10 Exempel: Meny i e8 lager Menyn i föregående exempel utökas med posidonering Steg 1 HTML- och JavaScript- koden är exakt densamma som Ddigare CSS- koden förändras på följande säb: li- taggen som omger undermenyn får reladv posidonering den inre menyn (ul) får absolut posidonering ex6-1" Steg 2 händelsehanterarna ändrade, så ab menyerna dyker upp på onmouseover och försvinner på onmouseout funkdonen är uppdelad i varsin funkdon för händelserna ex6-2" 10

11 Exempel: Popupmenyer I exempel 6-2 finns eb problem. Menyerna försvinner då man för ner markören över dem. Deba är här fixat, genom ab flyba in händelsehanterarna Dll li- taggen. Eb class- abribut i li- taggarna, för ab enkelt komma åt dem med getelementsbyclassname i JavaScript- koden. Ta bort parentnode i referensen Dll undermenyn. ex7" 11

12 Exempel: Ändring av z- index Olika boxar med informadon ligger delvis överlappande varandra. posidon:absolute och förskjuten ler- koordinat Man kan bläddra igenom boxarna, så ab man ändrar vilken som ska ligga längst fram ändra z- index ex8" 12

13 display eller visibility? display visas inbäddad i dokumentets presentadon värde på display bestämmer hur det bäddas in block, eb eget stycke inline, en del av raden/ stycket döljs med värdet none övrigt innehåll trycks ihop visibility och posidon:absolute visas i eb lager framför övrigt innehåll kan posidoneras med koordinater flera lager kan förekomma z- index bestämmer lagerskikt (z- axel) ju högre värde på z- index, desto längre fram döljs med värdet hidden övrigt innehåll påverkas ej 13

Övningar i JavaScript del 5

Övningar i JavaScript del 5 Övningar i JavaScript del 5 I dessa övningar ska vi ta upp några lika händelsehanterare. Dessa ska dck inte läggas in med attribut i HTML-kden, så sm vi gjrt tidigare med nclick. Istället ska vi nu lägga

Läs mer

Loopar och objekt i JavaScript

Loopar och objekt i JavaScript Föreläsning i webbdesign Loopar och objekt i JavaScript Rune Körnefors Medieteknik 1 2012 Rune Körnefors rune.kornefors@lnu.se Programflöde Vanligt sekvendellt flöde InstrukDonerna ugörs en eher en i den

Läs mer

Struktur & Layout med CSS

Struktur & Layout med CSS 1ME321 Webbteknik 1 Lek0on 5 Struktur & Layout med CSS Rune Körnefors Medieteknik 1 2015 Rune Körnefors rune.kornefors@lnu.se Agenda Veckoplanen Vecka 40 Läsanvisningar Exemplet Gretas Blommor GarreKs

Läs mer

Labora&on 8 Formulär övningar/uppgi6er

Labora&on 8 Formulär övningar/uppgi6er Labora&on 8 Formulär övningar/uppgi6er 1M321 Webbteknik 1, 7,5hp Medieteknik 2015 Rune Körnefors rune.kornefors@lnu.se 1a. Ladda ner arbetsdokument Till övningarna i denna labora&on finns det en par dokument

Läs mer

JavaScript del 9 Dynamik och animeringar

JavaScript del 9 Dynamik och animeringar JavaScript del 9 Dynamik och animeringar Det sista vi ska titta på när det kommer till att lära oss JavaScript är hur vi skapar dynamik på vår webbplats, ge användarna chansen att påverka vad som händer

Läs mer

Kravspecifika.on, pappersprototyp & CSS

Kravspecifika.on, pappersprototyp & CSS 1ME321 Webbteknik 1 Lek0on 4 Kravspecifika.on, pappersprototyp & CSS Rune Körnefors Medieteknik 1 2015 Rune Körnefors rune.kornefors@lnu.se Agenda Veckoplanen Vecka 39 UppgiI U2 = L4+L5+L6 UppgiI U3 Allmänna

Läs mer

Xhtml och CSS.Tillämpad fysik och elektronik Per Kvarnbrink (redigering Ulf Holmgren 2011)

Xhtml och CSS.Tillämpad fysik och elektronik Per Kvarnbrink (redigering Ulf Holmgren 2011) Laboration 1: Xhtml och CSS.Tillämpad fysik och elektronik Per Kvarnbrink (redigering Ulf Holmgren 2011) Målsättning Att prova på grundläggande html samt att separera innehåll och utseende. Slutresultatet

Läs mer

Labbrapport: HTML och CSS

Labbrapport: HTML och CSS Labbrapport: HTML och CSS Utförd av: Natalie Olmosse Mailadress: natalie.olmosse@gmail.com Datum: 2015 12 18 Kursansvarig: Karin Fahlquist Övriga lärare: Ulrik Söderström Första inlämningen Resultat (Godkänd/Retur):

Läs mer

Tillämpad fysik och elektronik Per Kvarnbrink m.fl. Laboration 2: HTML och CSS.

Tillämpad fysik och elektronik Per Kvarnbrink m.fl. Laboration 2: HTML och CSS. Laboration 2: HTML och CSS. Målsättning Att prova på grundläggande html samt att separera innehåll och utseende. Slutresultatet kommer att bli en enkel webbplats med layout, bakgrundsbilder, minst en meny

Läs mer

Länkar och navigering

Länkar och navigering Föreläsning i webbdesign Länkar och navigering Rune Körnefors Medieteknik 1 2012 Rune Körnefors rune.kornefors@lnu.se Hypertext Hyper [grekiska] över Hypertext Går över textens sekvengella flöde Referens

Läs mer

För att skriva CSS-kod använder man sig av olika kommandon. Ett exempel på hur man kan skriva kod för att ändra textfärg kan vara:

För att skriva CSS-kod använder man sig av olika kommandon. Ett exempel på hur man kan skriva kod för att ändra textfärg kan vara: Hemsida CSS Introduktion till Cascading Style Sheets (CSS) Detta är en mycket kort genomgång av CSS med exempel på hur sådan kod ska läsas och hur den kan användas på IdrottOnline-sidor. Är man ute efter

Läs mer

Övningar i JavaScript del 4

Övningar i JavaScript del 4 Övningar i JavaScript del 4 I dessa övningar ska du dels hantera ett frmulär ch dels arbeta med några textsträngar. 1. Dkument i övningsmappen Övningsmappen sm du laddar ner från labratinens webbsida innehåller

Läs mer

Föreläsning i webbdesign. Interak*onsdesign. Rune Körnefors. Medieteknik. 2012 Rune Körnefors rune.kornefors@lnu.se

Föreläsning i webbdesign. Interak*onsdesign. Rune Körnefors. Medieteknik. 2012 Rune Körnefors rune.kornefors@lnu.se Föreläsning i webbdesign Interak*onsdesign Rune Körnefors Medieteknik 1 2012 Rune Körnefors rune.kornefors@lnu.se Från föreläsning F1 Användarcentrerad design "Take the user into account every step of

Läs mer

ORDLISTA WEBBDESIGN 100P

ORDLISTA WEBBDESIGN 100P ORDLISTA WEBBDESIGN 100P HTML- TAGGAR M.M. (DE BLÅFÄRGADE ORDEN ÄR OLIKA ATTRIBUT SOM HÖR TILL DE OLIKA TAGGARNA.) HTML Står för Hyper Text Markup Language och är en uppsättning markeringskoder.

Läs mer

Widgetguiden Vad är Publits widgetshop?

Widgetguiden Vad är Publits widgetshop? Widgetguiden Den här guiden är till för dig som vill använda Publits widgetshop för att enkelt sälja böcker direkt på din egen hemsida, blog eller Facebook. Här går vi steg för steg igenom processen för

Läs mer

Introducerande övningar i HTML

Introducerande övningar i HTML Introducerande övningar i HTML En webbsida består av en textfil som innehåller sidans text och koder i språket HTML, för att formatera innehållet. Har man bilder på sidan, så finns de som separata filer

Läs mer

www.grade.com LUVIT LMS Quick Guide LUVIT Composer

www.grade.com LUVIT LMS Quick Guide LUVIT Composer www.grade.com LUVIT LMS Quick Guide LUVIT Composer LUVIT Composer LUVIT Composer är ett verktyg för att enkelt skapa snyggt innehåll direkt i LUVITs kurser. Verktyget innehåller designade mallar som du

Läs mer

Övningar i JavaScript del 3

Övningar i JavaScript del 3 Övningar i JavaScript del 3 I dessa övningar tar vi upp datumbjektet Date, arrayer ch lpar. Du utgår från ett prgram där man kan klicka på små bilder ch mtsvarande stra bild visas. Detta är i princip samma

Läs mer

TDDD52 CSS. Färger. Färger 1/3/13

TDDD52 CSS. Färger. Färger 1/3/13 Jag önskar göra det lä0are för användarna genom a0 markera vissa delar med en annan färg? HTML är bra, men det är inte så snyggt? TDDD52 - CSS CSS regler och selectors gör a0 jag kan styla min HTML precis

Läs mer

E07 "Greased Lightning"

E07 Greased Lightning E07 "Greased Lightning" Föreläsning 7, HT2014 CSS och Event Kurs: 1dv403 Webbteknik I Johan Leitet E07 Greased Lightning Dagens agenda CSS-egenskaper Händelsestyrd programmering Händelsehanterare Typer

Läs mer

En introduktion till Dynamisk HTML (DHTML)

En introduktion till Dynamisk HTML (DHTML) En introduktion till Dynamisk HTML (DHTML)? 2002 1 DHTML en introduktion...3 Vad är DHTML?...3 Vad behöver du för att lära dig DHTML?...3 Document Object Model i Internet Explorer 4...4 Document Object

Läs mer

Kom igång. Readyonet Lathund för enkelt admin. Logga in Skriv in adressen till din webbsida följt av /login. Exempel: www.minsajt.

Kom igång. Readyonet Lathund för enkelt admin. Logga in Skriv in adressen till din webbsida följt av /login. Exempel: www.minsajt. Kom igång Logga in Skriv in adressen till din webbsida följt av /login. Exempel: www.minsajt.se/login Nu dyker en ruta upp på skärmen. Fyll i ditt användarnamn och lösenord och klicka på "logga in". Nu

Läs mer

Övning 1 Vi börjar med en vanlig html-fil där html används för både innehåll och utseende:

Övning 1 Vi börjar med en vanlig html-fil där html används för både innehåll och utseende: Uppsala universitet Institutionen för utbildning, kultur och medier IKT A HT 2009 Monica Langerth Zetterman 2009-09-23 Testa stilmallar Övning 1 Vi börjar med en vanlig html-fil där html används för både

Läs mer

Adobe. Dreamweaver CS3. Grundkurs. www.databok.se

Adobe. Dreamweaver CS3. Grundkurs. www.databok.se Adobe Dreamweaver CS3 Grundkurs www.databok.se Innehållsförteckning 1 Arbetsmiljön... 1 Användningsområde... 1 Starta Dreamweaver... 2 Arbeta i Dreamweaver... 2 Fönster... 3 Statusfältet... 4 Menyer...

Läs mer

Del 1 och 2 HTML/CSS. Webbutveckling Laboration 1 Nicklas Bostedt 850906-8550

Del 1 och 2 HTML/CSS. Webbutveckling Laboration 1 Nicklas Bostedt 850906-8550 Del 1 och 2 HTML/CSS Vi har fått i uppgift att göra en hemsida av eget val! Jag har bestämt mig för att skapa en hemsida åt en påhittad restaurang här i Umeå som inriktar sig på exklusiv nyttig mat och

Läs mer

AIF:arens guide till cyberrymden

AIF:arens guide till cyberrymden AIF:arens guide till cyberrymden www.andrarumsif.se Reviderad 2008-04-14 1 Välkommen till www.andrarumsif.se:s användarmanual! Denna manual ska inte ses som en fullständig manual till hemsidan utan snarare

Läs mer

Användarhandledning. Svenska Turistföreningen. Wordmallar Office 2010 2013-03-01

Användarhandledning. Svenska Turistföreningen. Wordmallar Office 2010 2013-03-01 Användarhandledning Svenska Turistföreningen Wordmallar Office 2010 2013-03-01 Inledning Nedan följer en kort instruktion om hur man går till väga för att använda STFs Wordmallar för Office 2010. Handledning

Läs mer

LUVIT LMS Quick Guide LUVIT Composer

LUVIT LMS Quick Guide LUVIT Composer www.grade.com LUVIT LMS Quick Guide LUVIT Composer LUVIT Composer LUVIT Composer är ett verktyg för att enkelt skapa snyggt innehåll direkt i LUVITs kurser. Verktyget innehåller designade mallar som du

Läs mer

Prototyper och användartest

Prototyper och användartest Föreläsning i webbdesign Prototyper och användartest Rune Körnefors Medieteknik 1 2012 Rune Körnefors rune.kornefors@lnu.se Prototyp för en webbplats! Utkast eller enkel variant av webbplatsen" Syfte"

Läs mer

6 LÄGG TILL INTERAKTIVITET

6 LÄGG TILL INTERAKTIVITET 6 LÄGG TILL INTERAKTIVITET I den här lektionen, lägger du till Webb 2.0-funktionalitet till dina webbsidor genom att göra följande: Använda Dreamweaver-beteenden Tillämpa ett beteende med hjälp av Spry-effekter

Läs mer

Visuell design Bilder & färger

Visuell design Bilder & färger 1ME321 Webbteknik 1 Lek0on 8 Visuell design Bilder & färger Rune Körnefors Medieteknik 1 2015 Rune Körnefors rune.kornefors@lnu.se Agenda Veckoplanen Vecka 43 Läsanvisningar UpphovsräPslagen Kort sammanfapning

Läs mer

På många sätt är webben, när det kommer till kritan, en samling länkar. Inom varje given plats, gör länkarna det möjligt att snabbt navigera från ett

På många sätt är webben, när det kommer till kritan, en samling länkar. Inom varje given plats, gör länkarna det möjligt att snabbt navigera från ett På många sätt är webben, när det kommer till kritan, en samling länkar. Inom varje given plats, gör länkarna det möjligt att snabbt navigera från ett relaterat ämne till ett annat. En länk från en sida

Läs mer

Webbutveckling Laboration 1: HTML5 och CSS3.

Webbutveckling Laboration 1: HTML5 och CSS3. Institutionen för 2015-11-30 Tillämpad fysik och elektronik Karin Fahlquist Webbutveckling Laboration 1: HTML5 och CSS3. Målsättning Att skapa en webbplats genom att först skapa en Lo-fi prototyp och sedan

Läs mer

Manual till publiceringsverktyg

Manual till publiceringsverktyg Manual till publiceringsverktyg Allmänt När man har loggat in hamnar man direkt på översikten över hela webbplatsen. Överst hittar man en meny som alltid ligger med i verktyget. Denna meny innehåller översikten

Läs mer

En grundkurs i hemsidor och hur de är uppbyggda

En grundkurs i hemsidor och hur de är uppbyggda En grundkurs i hemsidor och hur de är uppbyggda Den här artikeln tänkte väldigt grundligt gå igenom koncepten kring en hemsida och hur den är uppbyggt, för att ge dig grundkunskap att bygga vidare på och

Läs mer

Business Online Generellt

Business Online Generellt Motsvarande vägledningar för vänstermeny hittar du längre ner i dokumentet Menyn Du kan navigera i Business Online på flera olika sätt. Ingången till de olika funktionerna hittar du via toppmenyn. Genom

Läs mer

Att skriva rapport. Innehåll

Att skriva rapport. Innehåll Att skriva rapport Innehåll 1 Skapa ny rapport... 2 2 Börja skriva på sidan 7 (udda sida)... 2 3 Formatmallar... 2 4 Egen flik... 3 5 Innehållsförteckning... 3 Uppdatera innehållsförteckningen... 4 6 Titelsidor...

Läs mer

PRO Järbo Navigeringsguide

PRO Järbo Navigeringsguide PRO Järbo Navigeringsguide Startsida PRO Järbo Fliken Start i HUVUDMENYN är markerat. Vi befinner oss på webbplatsens STARTSIDA. Nyhetskarusellen - webbplatsens löpsedlar. Växla genom att klicka på vänstra

Läs mer

Programmeringteknik. Planering 2014-05-12 MÅL LABB: MOMENT LAB4 HTML - EXEMPEL HTML. Webbdelen

Programmeringteknik. Planering 2014-05-12 MÅL LABB: MOMENT LAB4 HTML - EXEMPEL HTML. Webbdelen MÅL Programmeringteknik Webbdelen Efter webbmomentet ska du: kunna använda ett tiotal kommandon i: HTML (göra webbsidor) CSS (webbsidans utseende) Javascript (programmering - klienten) PHP (programmering

Läs mer

Business Online Generellt

Business Online Generellt Menyn Du kan navigera i Business Online på flera olika sätt. Ingången till de olika funktionerna hittar du via toppmenyn. Genom att klicka på menyn fälls de tillhörande undermenyerna ut. Du kan bara se

Läs mer

Lathund. Skriva artiklar på http://kalmar.regionbiblioteket.se 2014-12-04

Lathund. Skriva artiklar på http://kalmar.regionbiblioteket.se 2014-12-04 2014-12-04 Lathund Skriva artiklar på http://kalmar.regionbiblioteket.se Introduktion Denna lathund beskriver hur du ska göra för att skriva artiklar på regionbibliotekets egna sidor i den gemensamma

Läs mer

2009-08-20. Manual för Typo3 version 4.2

2009-08-20. Manual för Typo3 version 4.2 2009-08-20 Manual för Typo3 version 4.2 1 2 Innehåll: 1. Allmänt 4 2. Grunderna i Typo3 5 2.1 Knappar 5 2.2 Inloggning 5 2.3 Den inledande vyn 6 2.4 Sidträdet 7 3. Sidor 8 3.1 Skapa en ny sida 8 3.1.1

Läs mer

JAVASCRIPT. Beteende

JAVASCRIPT. Beteende JAVASCRIPT Beteende OVERVIEW HTML Formulär JavaScript Syntax Events DOM Validering av fomulär WEBBPROGRAMMERING PÅ KLIENTSIDAN Skriptspråk som körs på klientsidan (klientskript) Koden exekveras i webbläsaren

Läs mer

Att använda laget.se

Att använda laget.se 2012 Att använda laget.se för ungdomsledare i MSSK Dokumentet är framtaget för att hjälpa till att förenkla användningen av lagens webbsidor. Har du förslag på ändringar eller ser felaktigheter kan du

Läs mer

när du arbetar med uppsatser och andra långa texter

när du arbetar med uppsatser och andra långa texter Tricks i Word när du arbetar med uppsatser och andra långa texter Åsa Kronkvist Högskolan Kristianstad Våren 2007 Innehåll Dags att skriva uppsats?... 3 Att tänka på innan du börjar... 3 Spara klokt...

Läs mer

Excel kortkommando. Infoga rad, kolumn eller cell Ta bort rad, kolumn eller cell

Excel kortkommando. Infoga rad, kolumn eller cell Ta bort rad, kolumn eller cell Excel kortkommando Kommando Allmänt F10 Ctrl + B eller Skift + F5 Ctrl + G Ctrl + H Ctrl + i F1 Ctrl + N Ctrl + O Ctrl + P Ctrl + S F12 eller Alt + F2 Ctrl + W eller Alt + F4 Skift + F1 Skift + F10 Ctrl

Läs mer

Webbdesign Process till produkt

Webbdesign Process till produkt Webbdesign Process till produkt Umeå Universitet Mediaproduktion för www II 7,5hp Isak Madoun Introduktion; VÅR-KOKBOK Är en kokbok som i sin första upplgaga kom ut på 50-talet. Boken innehåller mer av

Läs mer

Manual för Juseks aktivitetsadministrationssystem

Manual för Juseks aktivitetsadministrationssystem Manual för Juseks aktivitetsadministrationssystem ett system baserat på Softadmin från Multisoft Komma åt och logga in i aktivitetssystemets admindel Tanken är att du skall kunna komma åt systemet på samma

Läs mer

Word 2003. bengt hedlund

Word 2003. bengt hedlund Word 2003 bengt hedlund Det här dokumentet är tänkt underlätta för Dig när Du arbetar med Word. I kursen Datagrund, när Du skriver en rapport i någon annan kurs, eller i varje sammanhang när Du vill använda

Läs mer

Användarhandbok. version 1.15.8. sida 1 av 15

Användarhandbok. version 1.15.8. sida 1 av 15 Användarhandbok version 1.15.8 sida 1 av 15 Innehållsförteckning Introduktion... 4 Gränssnitt... 4 Inloggning... 5 Användarnamn och lösenord... 5 Kod... 5 Startsida... 6 Menyer... 6 Systembild... 7 Sidobjekt...

Läs mer

Laboration med Internet och HTML

Laboration med Internet och HTML Laboration med Internet och HTML Denna laboration går ut på att du skall kunna skapa enkla hemsidor i HTML. Vi kommer inte att ta upp edstorer för hemsidor som t.ex. DreamWeaver eller FrontPage. Dessa

Läs mer

Internet & WWW Laboration 2 VT10 Högskolan Dalarna Hans Rosendahl. Laboration 2 CSS del 1. 1 av 8

Internet & WWW Laboration 2 VT10 Högskolan Dalarna Hans Rosendahl. Laboration 2 CSS del 1. 1 av 8 Laboration 2 CSS del 1 1 av 8 Vad kommer jag att lära mig på laboration 2? Skriva en stilmall: o Skriva extern CSS-mall och länka den till XHTML-dokument o Skriva inbäddad CSS-mall i XHTML-dokument o Skriva

Läs mer

Skapa en mall för inlämning av skriftliga uppgifter. med hjälp av Open Office Writer

Skapa en mall för inlämning av skriftliga uppgifter. med hjälp av Open Office Writer Skapa en mall för inlämning av skriftliga uppgifter med hjälp av Open Office Writer Enkel guide till ordbehandling med Open Office www.openoffice.org Medieteknik Södertörns högskola 31 januari 2011 uppdaterad

Läs mer

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR I följande dokument hittar ni information om hur ni administrerar er nya hemsida. Manualen går endast igenom grundläggande administration. För mer avancerad redigering

Läs mer

Användarhandledning DORUM

Användarhandledning DORUM Demografiska databasen Sid 1 (19) Användarhandledning DORUM Datum: 2012-09-19 Version: 1.0 Projektledare: Carin Hedlund, Mattias Sandström Innehållsförteckning Åtkomst 3 Ej inloggad 3 Inloggning 7 Dorums

Läs mer

07/12/2015. Stilmallar. - styra utseendet av webbplatsen DEL 1. Karin Fahlquist. index.html. iecept.html frukt.html grönsaker.html

07/12/2015. Stilmallar. - styra utseendet av webbplatsen DEL 1. Karin Fahlquist. index.html. iecept.html frukt.html grönsaker.html Stilmallar - styra utseendet av webbplatsen DEL 1 Karin Fahlquist index.html iecept.html frukt.html grönsaker.html 1 Samma kod olika utseende Olika exempel om layout: http://www.csszengarden.com/ Utseende

Läs mer

Lathund för att skapa dokument i redigeraren

Lathund för att skapa dokument i redigeraren Lathund för att skapa dokument i redigeraren Denna guide beskriver hur man skapar ett dokument i redigeraren. Redigeraren är Fronters inbyggda textredigerare. Man kan även låta andra skriva och kommentera

Läs mer

Lathund - Redaktörer

Lathund - Redaktörer Lathund - Redaktörer 1. Logga in sid 3 2. Ladda upp/publicera dokument...sid 4-6 2.1 Att lägga till ett dokument...sid 5 2.2 Var publiceras mitt dokument...sid 6 3. Jobba i befintligt dokument...sid 7

Läs mer

Så här funkar Föreningsliv

Så här funkar Föreningsliv Så här funkar Föreningsliv Logga in Logga in på den adress du fått skickat till dig via mail. Använd det lösenord och användarnamn som du tilldelats. Kom alltid ihåg att logga ut när du skrivit färdigt,

Läs mer

Ladda hem administratörs klient För att mata in resultaten i systemet används ett speciellt administratörs program. Det finns att ladda hem från:

Ladda hem administratörs klient För att mata in resultaten i systemet används ett speciellt administratörs program. Det finns att ladda hem från: Sida 1 av 8 Kort manual för tävlingsledare och administratörer inmatning av resultat. Nedan följer en väldigt kortfattad manual/instruktion avsedd för de som skall installera och använda administratörs/rapporterings

Läs mer

LATHUND TILL GOOGLE SITES

LATHUND TILL GOOGLE SITES LATHUND TILL GOOGLE SITES 2012 Mörbyskolan Denna lathund går igenom hur du skapar, redigerar och kan använda Google Sites i undervisningen Rev. 1.0a Innehållsförteckning 1. VAD ÄR GOOGLE SITES? ES?.........2

Läs mer

Laboration 1. Webbprodution Struktur & innehåll HT2015

Laboration 1. Webbprodution Struktur & innehåll HT2015 Laboration 1 Webbprodution Inledning Denna inledande laboration syftar i mångt och mycket till att du ska känna dig bekväm med den laborationsmiljö ni blivit introducerat inför. De inledande uppgifterna

Läs mer

ibooks Author Komma igång

ibooks Author Komma igång ibooks Author Komma igång Välkommen till ibooks Author, ett lätt sätt att skapa snygga och interaktiva Multi-Touch-böcker för ipad och Mac. Börja med proffsiga Apple-designade mallar med mängder av eleganta

Läs mer

Webbprogrammering 725G54

Webbprogrammering 725G54 Webbprogrammering 725G54 Hej! Jakob Bandelin, gästadjunkt jakob.bandelin@liu.se Interaktionsdesign, webbdesign, apputveckling Agenda Kursmål och -upplägg HTML Teckenkodning Validering Lab 1. Kursmål exemplifiera

Läs mer

Snabbguide till GlobalTwitcher (Juni 2012)

Snabbguide till GlobalTwitcher (Juni 2012) Snabbguide till GlobalTwitcher (Juni 2012) Denna snabbguide är avsedd att hjälpa nya medlemmer att komma igång med huvudfunktionerna på GlobalTwitcher (GT). Siten innehåller dock ett stort antal funktioner

Läs mer

SPF/MiRiaM Manual avancerad sökning

SPF/MiRiaM Manual avancerad sökning SPF/MiRiaM Manual avancerad sökning 2016-09-15 Skapat av: Fältström Ingrid 1 (31) Innehållsförteckning 1. Inledning... 3 1.1 Begreppsförklaringar... 3 1.1.1 Kolumn... 3 1.1.2 Lista... 3 1.1.3 Posttyp...

Läs mer

Att bygga enkla webbsidor

Att bygga enkla webbsidor Nivå 1 Att bygga enkla webbsidor All Code Clubs must be registered. Registered clubs appear on the map at codeclubworld.org - if your club is not on the map then visit jumpto.cc/18cplpy to find out what

Läs mer

Webbteknik för ingenjörer

Webbteknik för ingenjörer Institutionen för 2015-01-22 Tillämpad fysik och elektronik Karin Fahlquist Webbteknik för ingenjörer HTML5 & CSS laboration Målsättning Att skapa en webbplats utifrån en Lo-fi prototyp och implementera

Läs mer

4 Kolumn Kalkylbladet är uppdelat i rader (horisontellt) och kolumner (vertikalt). Där dessa möts finns alltid en cell.

4 Kolumn Kalkylbladet är uppdelat i rader (horisontellt) och kolumner (vertikalt). Där dessa möts finns alltid en cell. Lathund för Microsoft Excel 1 2 9 4 Kolumn Kalkylbladet är uppdelat i rader (horisontellt) och kolumner (vertikalt). Där dessa möts finns alltid en cell. Innehåll Autofyll Celler Diagram Ändra diagramtyp

Läs mer

Medieteknologi Webbprogrammering och databaser MEB725, 5p (7,5 ECTS) Klientprogrammering JavaScript Program på flera sidor

Medieteknologi Webbprogrammering och databaser MEB725, 5p (7,5 ECTS) Klientprogrammering JavaScript Program på flera sidor http://w3.msi.vxu.se/multimedia Medieteknologi Webbprogrammering och databaser MEB725, 5p (7,5 ECTS) Klientprogrammering JavaScript Program på flera sidor Rune Körnefors Innehåll Variabler i JavaScript

Läs mer

GEKAB Marking & Sign System - genvägen till en effektiv märkning

GEKAB Marking & Sign System - genvägen till en effektiv märkning GEKAB Marking & Sign System - genvägen till en effektiv märkning www.gekab.se INNEHÅLL LOGGA IN SYSTEMET SKAPA SKYLTAR 5 - SKAPA NY SKYLT 6 - IMPORTERA FRÅN EXCEL 7 - LISTAN 8 SKAPA MÄRKE 9 - IMPORTERA

Läs mer

Nätet. Uppgiften. Nivå

Nätet. Uppgiften. Nivå Nivå 1 Nätet All Code Clubs must be registered. Registered clubs appear on the map at codeclubworld.org - if your club is not on the map then visit jumpto.cc/ccwreg to register your club. Uppgiften Har

Läs mer

3. Hämta och infoga bilder

3. Hämta och infoga bilder Sida 1 av 8 Lektion 1: sida 4 av 4 «Sida 3 av 4 Till kursens framsida 3. Hämta och infoga bilder Nu vet vi ju hur man sätter in text i sin sida. Men hur gör man med bilder? Det är inte svårt alls! Det

Läs mer

Vilken version av Dreamweaver använder du?

Vilken version av Dreamweaver använder du? Sida 1 av 7 Lektion 1: sida 1 av 4 Till kursens framsida Sida 2 av 4» Lektion 1 Då ska vi sätta igång med den här kursens första lektion! Här kommer du att få lära dig hur man skapar och förbereder webbplatser

Läs mer

Övningar i CSS för anpassning till olika enheter

Övningar i CSS för anpassning till olika enheter Övningar i CSS för anpassning till lika enheter Hittills har vi i föregående labratiner tittat på hur man med CSS utfrmar en presentatin för bildskärm på en vanlig datr. Men det finns fler presentatiner

Läs mer

Introduktion till Word och Excel

Introduktion till Word och Excel Introduktion till Word och Excel HT 2006 Detta dokument baseras på Introduktion till datoranvändning för ingenjörsprogrammen skrivet av Stefan Pålsson 2005. Omarbetningen av detta dokument är gjord av

Läs mer

Kom igång och redigera din hemsida!

Kom igång och redigera din hemsida! Kom igång och redigera din hemsida Smelink WEB l Storgatan 14 l 352 31 Växjö l support@smelink.se l www.smelink.se Senast uppdaterad: 120918 Del 1 Logga in Välkommen att ta del av vårt uppdateringsverktyg,

Läs mer

TES Mobil. Användarmanual. Användarmanual TES Mobil Dok.nr. 32-019-03-02 v8

TES Mobil. Användarmanual. Användarmanual TES Mobil Dok.nr. 32-019-03-02 v8 1 TES Mobil Användarmanual 2 Innehållsförteckning 1 Introduktion... 3 1.1 Vad kan man göra med TES Mobil?... 3 1.2 Vad är en RFID-tag?... 3 1.3 Olika hantering på olika mobiltelefoner... 3 1.4 Rekommendationer

Läs mer

Introduk+on +ll programmering i JavaScript

Introduk+on +ll programmering i JavaScript Föreläsning i webbdesign Introduk+on +ll programmering i JavaScript Rune Körnefors Medieteknik 1 2012 Rune Körnefors rune.kornefors@lnu.se Språk Naturliga språk Mänsklig kommunika+on T.ex. Svenska, engelska,

Läs mer

HTML5 Semantic. Informationen kommer från w3schools.com. En semantisk elementet beskriver tydligt dess betydelse för både webbläsaren och utvecklaren.

HTML5 Semantic. Informationen kommer från w3schools.com. En semantisk elementet beskriver tydligt dess betydelse för både webbläsaren och utvecklaren. Vad är Semantic Elements? HTML5 Semantic Informationen kommer från w3schools.com Semantik (av grekiska sema, "tecken") avser det vetenskapliga studiet av teckensystems innebörd och tolkning. Semantic elements

Läs mer

INNEHÅLL DEL 2 FORMATERA KALKYL DEL 1 SKAPA KALKYL

INNEHÅLL DEL 2 FORMATERA KALKYL DEL 1 SKAPA KALKYL 1. INTRODUKTION TILL EXCEL 2008... 5 A. Docendo-pedagogiken...6 B. Hämta övningsfiler...7 C. Starta programmet...8 D. Avsluta programmet...8 E. Programfönstret...9 F. Elementgalleriet...10 G. Verktygslådan...11

Läs mer

Hur man lägger upp och redigerar dokument i Typo3.

Hur man lägger upp och redigerar dokument i Typo3. Hur man lägger upp och redigerar dokument i Typo3. Typo3 är ett så kallat CMS, Content Management System där du enkelt och smidigt kan lägga ut kursinformation och bilder. Detta verktyg är webbaserat vilket

Läs mer

SORSELE KOMMUN. Handbok OEW. 28 sept 2012 Mari-Anne Englund Barbro Olofsson. Sorsele kommun Version 2012-09-28, rev 131101 1 (19)

SORSELE KOMMUN. Handbok OEW. 28 sept 2012 Mari-Anne Englund Barbro Olofsson. Sorsele kommun Version 2012-09-28, rev 131101 1 (19) Handbok i OEW 28 sept 2012 Mari-Anne Englund Barbro Olofsson Sorsele kommun Version 2012-09-28, rev 131101 1 (19) Använd det användarnamn och lösenord som du fått. Fungerar det inte hör av dig till Mari-Anne

Läs mer

CSS-övningar. 1. Grunder

CSS-övningar. 1. Grunder CSS-övningar 1. Grunder CSS Testa stilmallar Klasser Elementen div och span Ärvda egenskaper Mer om typsnitt, marginaler och mått Textdekor Fristående CSS -fil Attributet style Prioritetsordning hos stilelement

Läs mer

Innan du börjar göra din katalog så rekommenderar vi att du läser igenom den korta introduktionen på startsidan.

Innan du börjar göra din katalog så rekommenderar vi att du läser igenom den korta introduktionen på startsidan. Innan du börjar göra din katalog så rekommenderar vi att du läser igenom den korta introduktionen på startsidan. Där efter går du till rutan Skapa ny katalog och väljer där att Skapa ny produktkatalog.

Läs mer

UTBILDNING & ARBETE Uppsatsskrivandets ABC

UTBILDNING & ARBETE Uppsatsskrivandets ABC UTBILDNING & ARBETE Uppsatsskrivandets ABC Borgarskolan Polhemsskolan Vasaskolan 1 Innehåll Abstract... 1 Analys... 1 Argument... 1 Bilagor... 1 Citat... 1 Enkät... 1 Fotnot... 1 Frågeställning... 1 Innehållsförteckning...

Läs mer

Inlämningsuppgift 2. DA156A - Introduktion till webbutveckling Teknik och samhälle, Malmö högskola Oktober 2012

Inlämningsuppgift 2. DA156A - Introduktion till webbutveckling Teknik och samhälle, Malmö högskola Oktober 2012 Oktober 2012 Uppgiften går ut på att redovisa dina kunskaper kring JavaScript, liksom din förmåga att skapa en CSS-baserad layout. Detta gör du genom att lämna in ett resultat som följer specifikationerna

Läs mer

Skapa en rapport med snygg formatering, rubriker, sidnummer och innehållsförteckning

Skapa en rapport med snygg formatering, rubriker, sidnummer och innehållsförteckning Skapa en rapport med snygg formatering, rubriker, sidnummer och sförteckning MS Office Word 2010 Precis som med målning och tapetsering blir jobbet med rapportskrivning både bra och roligt om man gjort

Läs mer

Övning (X)HTML 2. Sidan 1 av 7 2010-11-11

Övning (X)HTML 2. Sidan 1 av 7 2010-11-11 Sidan 1 av 7 2010-11-11 Övning (X)HTML 2 Innan du börjar med laborationen ska du se till så att du har öppnat din editor (till exempel Notepad++). I denna editor ska du skriva (X)HTML-kod som du sedan

Läs mer

Verktyget är begränsat till Microsoft Internet Explorer v 7.0 och uppåt

Verktyget är begränsat till Microsoft Internet Explorer v 7.0 och uppåt Verktyget är begränsat till Microsoft Internet Explorer v 7.0 och uppåt 1. Inställningar / Kontaktuppgifter Uppgifter som matas in i den vyn ovan visas i sidfoten på hemsidan: 2. Skapa nya sidor Om man

Läs mer

KARLSTADS UNIVERSITETSBIBLIOTEK

KARLSTADS UNIVERSITETSBIBLIOTEK 1(7) Guide till Zotero Med referenshanteringsprogrammet Zotero kan du enkelt samla dina referenser till böcker, artiklar m.m. och infoga källhänvisningar samt skapa litteraturlistor i MS Word och OpenOffice

Läs mer

Karlstads universitetsbibliotek

Karlstads universitetsbibliotek Karlstads universitetsbibliotek 2015 Guide till Zotero Med referenshanteringsprogrammet Zotero kan du enkelt samla dina referenser till böcker, artiklar m.m. och infoga källhänvisningar samt skapa litteraturlistor

Läs mer

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR I följande dokument hittar ni information om hur ni administrerar er nya hemsida. Manualen går endast igenom grundläggande administration. För mer avancerad redigering

Läs mer

Logga in till EPiSERVER

Logga in till EPiSERVER Logga in till EPiSERVER utbildningskane utbildningskane Navigering Väl inloggad i EPiServer möter du följande användargränssnitt (se bild nedan). Menyer och fönster är utsatta i bilden med siffror, vilka

Läs mer

Skapa en rapport med snygg formatering, rubriker, sidnummer och innehållsförteckning

Skapa en rapport med snygg formatering, rubriker, sidnummer och innehållsförteckning Skapa en rapport med snygg formatering, rubriker, sidnummer och sförteckning MS Office Word 2011 för Mac Precis som med målning och tapetsering blir jobbet med rapportskrivning både bra och roligt om man

Läs mer

Användarhandledning. Socialtjänstens medborgarsida

Användarhandledning. Socialtjänstens medborgarsida Användarhandledning Socialtjänstens medborgarsida Versionshistorik Version Beskrivning Författare Datum 1 Dokument upprättas Angelika Svahn 2015-08-20 Sida 2 av 19 Innehåll Versionshistorik... 2 Inledning...

Läs mer

Appar med ryggrad. Introduktion till JavaScriptramverket Backbone

Appar med ryggrad. Introduktion till JavaScriptramverket Backbone Appar med ryggrad Introduktion till JavaScriptramverket Backbone Vanlig webbsida Databas MVC - Model View Controller MVC - Model View Controller MVC Backbone.js Ger struktur Bygger på MVC konceptet Tvingar

Läs mer

Delrapport DP3. FGS för paketstruktur för e-arkiv Bilaga 1 METS

Delrapport DP3. FGS för paketstruktur för e-arkiv Bilaga 1 METS Delrapport DP3 FGS för paketstruktur för e-arkiv Bilaga 1 METS Karin Bredenberg & Mats Berggren IT/SoU 010-476 71 23 2013-01-14 2.0 1(9) INNEHÅLLSFÖRTECKNING 1. BILAGA 1: METS...3 1.1 INTRODUKTION...3

Läs mer

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR I följande dokument hittar ni information om hur ni administrerar er nya hemsida. Manualen går endast igenom grundläggande administration. För mer avancerad redigering

Läs mer