Youn nan "pi cho" teknik yo sou entènèt la jodi a se parallax defile. Nou tout te nan sit sa yo kote ou Thorne woulo liv la woule sou sourit ou a ak kontni an nan paj la deplase leve, li desann oswa atravè paj la jan ou Thorne wou an sourit.
Pou moun ki nouvo nan konsepsyon sit entènèt ak grafik konsepsyon, teknik sa a ka trè difisil reyalize akòz kantite lajan an nan CSS egzije.
Si sa dekri ou, gen yon kantite aplikasyon ki ka jis fè apèl a atis grafik. Yo fondamantalman itilize yon apwòch layout paj abitye nan paj wèb, ki vle di pa gen anpil, si genyen, kodaj ki enplike. Yon aplikasyon ki te reyèlman rocketed nan importance se Adobe Muse.
Travay la ke yo te fè pa avantaj grafik lè l sèvi avèk Muse se byen etonan ak ou ka wè yon echantiyon nan sa ou ka fè pa vizite sit la Muse nan Jou a . Menm si avantaj wèb yo gen tandans konsidere Muse tankou yo te kèk sòt de "van-up jwèt", li tou yo te itilize pa Designers yo kreye prototip mobil ak entènèt ki pral evantyèlman lage nan devlopè yo nan ekip yo.
Yon teknik ki ekstrèmman fasil akonpli ak Muse se parallax defile ak, si ou vle wè vèsyon an ranpli nan fè egzèsis la Nou pral mache a, pwen navigatè ou a nan paj sa a. Lè ou woule wou woule sourit ou a, tèks la sanble pou avanse pou pi oswa desann paj la ak chanjman yo imaj.
An n kòmanse.
01 nan 07
Kreye yon paj entènèt
Lè ou lanse Muse klike sou lyen nan lokal New . Sa a pral louvri pwopriyete yo New Site . Pwojè sa a pral fèt pou yon aplikasyon Desktop epi ou ka chwazi li nan meni Inisyal la pòp-desann meni. Ou kapab tou mete valè yo pou kantite kolòn, Gutter Width, marin, ak Padding. Nan ka sa a, nou pa t 'fò anpil konsène ak sa a epi tou senpleman klike OK .
02 nan 07
Fòma paj la
Lè ou mete pwopriyete yo sit epi klike OK ou te pran nan sa ki rele Plan View. Gen yon paj Kay nan tèt la ak yon paj Mèt nan pati anba a nan fennèt la. Nou sèlman bezwen yon sèl paj. Pou jwenn View View, nou double-klike sou paj la Kay ki louvri koòdone la.
Sou bò gòch la se yon kèk zouti de baz yo ak sou bò dwat la se yon varyete panno itilize yo manipile kontni an nan paj la. Ansanm tèt yo se pwopriyete yo, ki ka aplike nan paj la, oswa nenpòt bagay ki chwazi nan paj la. Nan ka sa a, nou te vle gen yon background nwa. Pou akonpli sa, nou klike sou chip nan Navigatè Ranpli koulè ak te chwazi nwa nan Picker a Koulè.
03 nan 07
Add tèks sou paj la
Pwochen etap la se ajoute kèk tèks nan paj la. Nou te chwazi Zouti nan Tèks ak te trase soti yon bwat tèks. Nou te antre nan mo "Byenveni nan" epi, nan Pwopriyete yo mete tèks la nan Arial, 120 piksèl Blan. Sant aliyen.
Nou Lè sa a, chanje nan zouti Seleksyon an, klike sou tèks la epi mete pozisyon Y li a 168 piksèl nan tèt la. Avèk bwat la tèks toujou chwazi, nou louvri panèl la aliman ak aliyen ti bwat la tèks nan sant la.
Finalman, ak bwat tèks la chwazi, nou te kenbe desann Opsyon / Alt ak Shift kle yo ak te fè kat kopi bwat tèks la. Nou chanje tèks la ak pozisyon Y nan chak kopi pou:
- Pou, 871
- Graphics, 1621
- Lojisyèl, 2371
- @ Roussillon.tk, 3181
Ou pral remake, menm jan ou mete kote chak bwat tèks, paj la resize pou akomode kote tèks la.
04 nan 07
Add Image Placeholders
Pwochen etap la se mete imaj ant blòk yo tèks.
Premye etap la se chwazi Zouti nan Rectangle epi trase bwat nou an ki detire soti nan yon sèl bò nan paj la nan lòt la. Avèk rektang lan chwazi, nou mete wotè li a 250 piksèl ak pozisyon Y li a 425 piksèl . Plan an se fè yo toujou detire oswa kontra nan lajè paj la akomode Viewport navigatè itilizatè a. Pou akonpli sa a, nou klike bouton lajè 100% nan pwopriyete yo. Ki sa ki fè sa se gri soti valè X la ak asire imaj la se toujou 100% nan lajè viewport nan yon navigatè.
05 nan 07
Ajoute Imaj nan plasè Imaj
Avèk Rectangle a chwazi nou klike lyen an Ranpli - pa Chip an koulè - epi klike lank nan maj mwen ajoute yon imaj nan rektang lan. Nan zòn nan Fitting , nou chwazi Echèl Anfòm ak klike sou manch lan sant nan zòn nan Pozisyon asire imaj la scaled soti nan sant la nan imaj la.
Apre sa, nou itilize teknik la Opsyon / Alt-Shift-trennen yo kreye yon kopi imaj la ant de premye blòk yo tèks, louvri panèl la Ranpli ak échanges imaj la pou yon lòt. Nou te fè sa pou de imaj ki rete yo tou.
Avèk imaj nan plas, li se tan ajoute mouvman an.
06 nan 07
Add Parallax defile
Gen yon kantite fason pou ajoute Parallax defile nan Adobe Muse. Nou pral montre w yon fason senp pou fè li.
Avèk panèl la Ranpli louvri, klike sou tab la woulo liv , epi, lè li ouvè, klike sou Moks kazye a .
Ou pral wè valè pou Inisyal ak Final Mouvman . Sa yo detèmine ki jan vit imaj la deplase nan relasyon ak wou a Scroll. Pou egzanp, yon valè de 1.5 ap deplase imaj la 1.5 fwa pi vit pase wou an. Nou itilize yon valè de 0 fèmen imaj yo an plas.
Flèch yo orizontal ak vètikal detèmine direksyon an nan mouvman an. Si valè yo se 0 imaj yo pa pral bouje kèlkeswa ki flèch ou klike sou.
Valè presegondè - Kle Pozisyon - montre pwen kote imaj yo kòmanse pou avanse pou pi. Liy anlè imaj la kòmanse, pou imaj sa a, 325 piksèl soti nan tèt la nan paj la. Lè woulo liv la rive nan valè sa a imaj la kòmanse deplase. Ou ka chanje valè sa a pa swa chanje li nan bwat dyalòg la oswa pa klike ak trenen pwen an nan tèt la nan liy lan swa monte oswa desann.
Repete sa pou lòt zidòl ki nan paj la.
07 nan 07
Tès Navigatè
Nan pwen sa a, nou te fini. Premye bagay nou te fè, pou rezon evidan, te chwazi File> Save Site . Nan tès navigatè, nou tou senpleman chwazi File> Preview Page nan Navigatè . Sa a louvri navigatè default òdinatè nou an, epi, lè paj la louvri, nou te kòmanse defile.