Page Title Page Title Page content goes here. Page Footer jQuery Mobile skabelon
jQuery Mobile Toptekst på siden Her kommer indholdet Det kan være tekst, billeder formularfelter, video, "lyd" og meget andet. Page Footer <!-- /footer slut
jQuery Mobile Toptekst på siden Her kommer indholdet Det kan være tekst, billeder formularfelter, video, "lyd" og meget andet. Page Footer <!-- /footer slut
jQuery Mobile ”Værktøjskassen” CSS jQuery Javascript-kode jQuery Mobile Javascript-kode Fordele: Alm. HTML 5 (evt. 4) + OK Standard-CSS + Lille indsats – stor virkning = Hurtig udvikling Skalerer til mobilskærm Dokumentation på - klik på DOCShttp://jquerymobile.com
Button Cancel Save Button Standardknap: Fylder hele bredden på skærmen
Eksempel: Delete Der findes et sæt af standard- ikoner til knapperne Ikonerne kan placeres forskelligt på knappen data-iconpos="right" data-iconpos=”top" data-iconpos=”bottom" Placering til venstre er standard <a href="index.html" data-role="button" data-icon="delete“ data-iconpos=“right”>Delete
Yes No Maybe Grupperede knapper Yes No Maybe Horisontalt grupperede knapper Add Delete Horisontalt grupperede knapper med ikoner Uden tekst:
Header Page Title Knapper i header – Links bliver automatisk til knapper Standardplacering: Først Venstre, Så Højre Farve: Samme som header Kan ændres med data- theme på knappen Cancel Edit Contact Save Page Title Options Knapper i header – selvvalgt position UI=User Interface Btn=button Footer Footer behandles i princippet som Header, dog er der ingen tvungen/standard-placering af knapperne – fri placering. Gruppering af knapper kan benyttes.
Navigationsbar Kan også placeres i Header og Footer. Max. 5 knapper på linie. Hvis flere, så laves placeres knapperne på flere rækker. One Two Three One Two Three I Header-blokken placeres..... lige efter overskrift og eventuelle knapper Navigationsbar i Footer Navigationsbar "i Header". Den aktive knap/side kan få særlig markering
Sammenklappeligt indhold på en side (1) Dette er en overskrift Dette er det sammenklappelige indhold. Standard er at indholdet ikke er synligt/udklappet (Note: Hvis indholdet skal være synligt fra starten: ) Dette er en overskrift Dette er det sammenklappelige indhold. Standard er at indholdet ikke er synligt/udklappet Sammenklappeligt indhold kan indsættes i sammenklappeligt indhold Dette er en overskrift 1 Dette er det sammenklappelige indhold. Standard er at indholdet ikke er synligt/udklappet Dette er en overskrift 2 Dette er det sammenklappelige indhold. Standard er at indholdet ikke er synligt/udklappet Dette er en overskrift 3 Dette er det sammenklappelige indhold. Standard er at indholdet ikke er synligt/udklappet
Sammenklappeligt indhold på en side (2) Noter: -tag: I eksemplerne er tekst sat i - tags. Det er ikke tvunget. Hvis der ikke er -tag spares en tom linie før og efter teksten. Teksten kan formaters med diverse tags for fed, kursiv, understreget tekst. Der kan indsættes links, knapper mv. Indhold: Der kan være billeder, video mv. i det sammenklappede indhold Dette er en overskrift 1 Dette er det sammenklappelige indhold. Standard er at indholdet ikke er synligt/udklappet ………………… ……
Sektion 1 Dette er det er indholdet i sektion 1 Section 2 Dette er det er indholdet i sektion 2 Sektion 3 Dette er det er indholdet i sektion 3. Sammenklappeligt indhold på en side – harmonikaudgaven (”accordian”) Note: Som standard er indholdet klappet sammen. Man kan vælge om en sektion skal være åben: (hvis ”data-collapsed …” ikke er der, så svaret det til ”= true”) Ved klik på + (Sektion 2):