Üle 100 miljoni tarbija kasutab veebisaidi com.score Inc. andmetel oma nutitelefoni Interneti sirvimiseks. Siit saate teada, kuidas luua mobiiliveebisait spetsiaalselt mobiilse vaatajaskonna jaoks. Selle õpetuse jaoks vajate Dreamweaver CS5 ja uuemaid versioone. Selles artiklis kirjeldatakse üksikasjalikult, kuidas luua jquery mobiiliveebisaiti.
Sammud
Samm 1. Avage Dreamweaver ja minge faili> Uus
Seejärel näete akent "Uus dokument". Vasakul küljel soovite valida valiku „leht näidisest”, seejärel valige järgmises veerus „Mobiilseadmete käivitajad” ja seejärel „jQuery Mobile (CDN)”
Samm 2. Looge lehed
Kui avate faili jQuery Mobile (CDN), näete lehte, mis näeb välja sarnane sellele:
Kuigi see on tehniliselt üheleheküljeline dokument, tähistab iga päis erinevat "lehte". Näiteks „Esimene leht” on mobiiliveebisaidi avaleht, „Teine leht” võiks olla leht meie kohta, „Kolmas leht” võiks olla teie teenuste leht jne
Samm 3. Vaadake koodi
Need toimingud võivad olla üsna keerulised, kui te ei tunne põhilist HTML -i. Sisu loomiseks proovige Dreamweaveris töötada jagatud vaates. Sellele režiimile pääsemiseks näete Dreamweaveri vasakpoolses nurgas failimenüü all nelja valikut "kood, jagamine, kujundus ja otseülekanne":
Valige esiletõstetud valik „split” ja näete kõrvuti koodi ja tegeliku saidivaadet. Heitke pilk koodile
Samm 4. Muutke iga lehe päiseid
Seal on (div data-role = "page"), mis tähendab, et see on uue lehe algus. Pange tähele, et iga leht on seotud numbriga 'div data-role = "page"' on teine leht, 'div data-role = "page"' on kolmas leht ja nii edasi
'div data-role = "header"' on päiseala ja panete oma päisteabe kahe märgendi "h1" ja "/h1" vahele.
Samm 5. Muutke sisu ja menüü üksusi
'div data-role = "Content"' on sisujaotise algus. Siia panete iga lehe tegeliku sisu. Pange tähele, et esimesel lehel on:
-
ja kui vaatate tegelikku veebilehte, näete, et esimesel lehel on linkide loend. 'ul data-role = "listview"' tähendab, et soovite sisualal linkide loendit. Kui lisate menüüelemente või 'data-role = "listview"', veenduge, et lingiksite õige teksti õigete lehtedega. Näiteks kui teine leht on „Meie kohta”, kolmas leht „Meie teenus” ja neljas leht „Võtke meiega ühendust”, siis soovite lisada:
Looge Dreamweaveriga mobiiliveebisait 5. samm Bullet 1 -
Nüüd sisu muutmiseks pange oma tekst märgendite 'div data-role = "content"' ja '/div' vahele. Näiteks:
Looge Dreamweaveriga mobiiliveebisait 5. samm Bullet 2
Samm 6. Redigeerige jalus
Jaluse muutmiseks pange oma tekst lihtsalt lehe jalus teksti asemel.
Samm 7. Vaadake oma veebisaiti reaalajas režiimis
Mäletate, kus lülitusite "jagatud režiimi"? just selles piirkonnas on nupp, mis ütleb "live". Klõpsake seda ja näete, kuidas teie veebisait telefonis välja näeb!
