Einn af "heitustu" tækni á vefnum í dag er parallax rolla. Við höfum öll verið á þeim stöðum þar sem þú snýr skrunahjólinu á músina og efnið á síðunni færist upp og niður eða yfir síðuna þegar þú skiptir músarhjólin.
Fyrir þá sem eru nýir í vefhönnun og grafískri hönnun getur þessi tækni verið mjög erfitt að ná vegna þess að magn CSS er krafist.
Ef það lýsir þér, þá eru nokkur forrit sem geta bara höfðað til grafíklistamanna. Þeir nota í grundvallaratriðum kunnugleg síðuuppsetningaraðferð á vefsíðum, sem þýðir að það er ekki mikið, ef einhver er, að taka þátt í kóða. Eitt forrit sem hefur virkilega rocketed áberandi er Adobe Muse.
Verkið sem grafíkfræðingar nota með Muse er alveg ótrúlegt og þú getur séð sýnishorn af því sem þú getur gert með því að heimsækja Muse Site of the Day . Þó að vefur kostir hafa tilhneigingu til að líta á Muse sem að vera einhvers konar "vinda-leikfang", er það einnig notað af hönnuðum til að búa til farsíma- og vefútgáfur sem verða að lokum afhentir teymiðum á liðinu.
Ein aðferð sem er ótrúlega auðvelt að ná með Muse er parallax rolla og ef þú vilt sjá lokið útgáfuna af æfingunni munum við ganga í gegnum, benda vafranum þínum á þessa síðu. Þegar þú rúlla skrúfhjól músarinnar virðist textinn fara upp eða niður á síðunni og myndirnar breytast.
Byrjum.
01 af 07
Búðu til vefsíðu
Þegar þú ræstir Muse smellirðu á New Site tengilinn. Þetta mun opna eignir nýrra vefsvæða . Þetta verkefni verður hannað fyrir skrifborðsforrit og þú getur valið það í valmyndinni Upphafsuppsetning. Þú getur einnig stillt gildi fyrir fjölda dálka, rennibekkja breiddar, margar og padding. Í þessu tilfelli vorum við ekki hræddir við þetta og smelltu einfaldlega á OK .
02 af 07
Sniðið síðu
Þegar þú stillir síðuna eiginleika og smellt á OK varst þú að því sem kallast Plan view. Það er heimasíða efst og meistarapunktur neðst í glugganum. Við þurftum aðeins eina síðu. Til að komast í hönnunarsýn, tvísmelltu á heimasíðuna sem opnaði tengið.
Til vinstri eru nokkrar undirstöðuatriði og hægra megin eru ýmsar spjöld notuð til að vinna með innihald á síðunni. Meðfram efstu eru eiginleikar, sem hægt er að beita á síðunni, eða eitthvað sem er valið á síðunni. Í þessu tilfelli viljum við hafa svartan bakgrunn. Til að ná þessu, smellum við á flipa flipa vafrans og velur svör frá litavalinu.
03 af 07
Bæta við texta við síðu
Næsta skref er að bæta við texta á síðunni. Við valdum textatólið og útskýrði textaskipan. Við komum inn í orðið "Velkomin" og í Eiginleikum stilltu textinn í Arial, 120 pixlar White. Miðstöð Aligned.
Við skiptum síðan yfir í valverkið, smellt á textareitinn og stillt Y stöðu sína í 168 punkta frá toppnum. Með textareitnum ennþá valið opnaðiðum við samsvörunarmiðann og lagaði textareitinn í miðjuna.
Að lokum, með textareitnum sem valinn var, héldu við niður valkostina / Alt og Shift lyklana og gerðu fjórar eintök af textareitnum. Við breyttum texta og Y stöðu hvers afrita til:
- Til, 871
- Grafík, 1621
- Hugbúnaður, 2371
- @info.com, 3181
Þú munt taka eftir því, þegar þú stillir staðsetningu hvers textareitunnar, breytir síðunni síðan til að mæta staðsetningu textans.
04 af 07
Bæta við myndarhöfum
Næsta skref er að setja myndir á milli textaskilanna.
Fyrsta skrefið er að velja Rectangle Tool og teikna kassann sem nær frá annarri hlið síðunnar til annars. Með rétthyrndinum sem valið er, stillum við hæðina upp í 250 punkta og Y-stöðu hennar er 425 punktar . Áætlunin er að hafa þau alltaf teygð eða samning við breiddarhliðina til að mæta vafraútgáfu notandans. Til að ná þessu, smelltum við á 100% breiddarhnappinn í eignunum. Hvað þetta gerir er grátt út X-gildi og til að tryggja að myndin sé alltaf 100% af úthlutunarbreiddinni í vafra.
05 af 07
Bættu myndum við myndatökustjóra
Með reitnum valið smelltum við á Fylltu hlekkinn - ekki litaspjaldið - og smellti á I Mage blekið til að bæta við mynd í rétthyrningi. Í mátunarsvæðinu valdum við Skala til að passa og smellti á miðjuhandfangið á staðsetningarsvæðinu til að tryggja að myndin sé minnkuð frá miðju myndarinnar.
Næstum notuðum við Valkostur / Alt-Shift-draga tækni til að búa til afrit af myndinni á milli fyrstu tveggja texta blokkanna, opnaðu fylla spjaldið og skipta um myndina fyrir aðra. Við gerðum þetta fyrir aðrar tvær myndir líka.
Með myndum í stað er kominn tími til að bæta við hreyfingu.
06 af 07
Bæta við Parallax flettingu
There ert a tala af leið til að bæta parallax rolla í Adobe Muse. Við ætlum að sýna þér einfaldan leið til að gera það.
Með því að opna fylla spjaldið skaltu smella á flipann Flipa og þegar það opnar smellirðu á hnappinn Hreyfimynd .
Þú munt sjá gildi fyrir upphafs- og lokapróf . Þetta ákvarðar hversu hratt myndin hreyfist í tengslum við rúllahjólið. Til dæmis, verðmæti 1,5 mun færa mynd 1,5 sinnum hraðar en hjólið. Við notuðum gildi 0 til að læsa myndunum á sínum stað.
Lárétt og lóðrétt örvar ákvarða átt hreyfingarinnar. Ef gildi eru 0 þá munu myndirnar ekki koma til greina óháð hvaða ör þú smellir á.
Miðgildi - Lykilstaða - sýnir punktinn þar sem myndirnar byrja að hreyfa. Línan fyrir ofan myndina byrjar, fyrir þessa mynd, 325 punkta efst á síðunni. Þegar skrunið nær þessu gildi byrjar myndin að hreyfa. Þú getur breytt þessu gildi með því að breyta því í valmyndinni eða með því að smella og draga punktinn efst á línuna, annað hvort upp eða niður.
Endurtaktu þetta fyrir aðrar myndir á síðunni.
07 af 07
Vafrapróf
Á þessum tímapunkti vorum við búinn að klára. Það fyrsta sem við gerðum af augljósum ástæðum var að velja File> Save Site . Til að prófa vafra valið við einfaldlega File> Preview Page í Browser . Þetta opnaði sjálfgefna vafrann í tölvunni okkar og þegar síðunni opnaði byrjaði við að fletta.