# 054: Puudutusest näitamiseks mobiilne navigeerimine - CSS-trikid

Lang L: none (table-of-contents)

Alustame tundliku kujundusega hästi. Kõige väiksemate ekraanisuurustega menüü jaguneb 2 × 4 ruudustikuks. See mahub kenasti ekraanile, kuid selle ja kaubamärgi vahel võtab see kohutavalt palju ruumi. Avame selle iOS-i simulaatoril ja näeme, et mõnel juhul ei näe te tegelikku sisu üldse.

Heidame pilgu mõnele ressursile, kuidas navigeerimismustreid käsitseda, näiteks Brad Frosti artikkel Responsive Navigation Patterns ja Jason Weaver Off Canvas. Vaatame ka MDN-is lahedat demot nimega Paperfold.

Lisame täiendava lingi navigeerimisele, mida me lõpuks nimetame „Navigeerimine 'n' otsinguks", mis toimib nupuna, et puudutades mobiilset navigeerimist kuvada. Meediumipäringute murdepunktide kaudu peidame ja kuvame seda nuppu vastavalt vajadusele.

Navigeerimise vahetamine, mida me enamasti haldame JavaScripti abil. Veidi riskantne, kuna see võõrastab väikesel ekraanil olevaid JavaScripti keelatud inimesi - aga ma lihtsalt lähen sellega kaasa. See arv on nii väike (väiksem kui JavaScripti töölaual, mis on kindlasti alla 1%), et hakkan lihtsalt jama ja jooksen sellega kaasa.

Kõik, mida me JavaScriptiga tegelikult teeme, on klassi nime vahetamine. See, mida mulle meeldib mõelda kui riigi juhitud CSS-i arendust. Kogu kontroll selle üle, mida näidatakse ning millal ja kuidas CSS-iga käideldakse. JavaScript määrab lihtsalt klassi praeguse oleku deklareerimiseks.

Me kulutame hulga aega nokitsemisele, lisades CSS-i „paberivoldid“, saades selle õigesti tööle ja paigutades seejärel mõne täidise abil otsingu põhisisu kohal olevasse tühimikku.

Lõppkokkuvõttes muudetakse suurust ja asukohta veelgi kenamaks ja lisatakse väike sulgemisnupp. Ma lähen oma peas edasi-tagasi, pakkudes kasutajaliidese olekute muutmiseks sellistel asjadel. Ühest küljest, miks peaks ta nüüd, kui kasutaja navigeerimise on paljastanud, selle sulgema? Nad on seda juba näinud. Kui nad seda kasutada ei soovi, saavad nad sellest lihtsalt mööda libistada. Teisest küljest on minu arvates kuidagi tüütu, kui ma ei saa selliseid olekuid muudes rakendustes vahetada (mingil põhjusel), nii et olen valmis pakkuma mehhanismi selle tegemiseks.

Huvitavad Artiklid...