Vi har den grundläggande gallerhuvudet på plats, men det saknas de små blå människorna som Erica satte i originalillustrationen. Vi hade pratat om det i förväg och bestämde oss för att det skulle vara ganska häftigt om när skärmen ändrades skulle folket stanna kvar när galleriväggen rörde sig bakom dem, så det ser ut som om de surfar i galleriet.
Eftersom folks grafik är rent oremantal, är det inte perfekt att använda markering för dem. Lyckligtvis finns det två av dem och vi får två gratis pseudoelement på varje element ( ::before
och ::after
). Vi använder dem för att lägga till dem.
Vi introducerar ett koncept i den här videon som kommer att fortsätta vara användbart, begreppet ”reverso media queries”. Vi arbetar till stor del på skrivbordet i denna design, så våra mediefrågor baseras mestadels på max-width
. Men om vi ställer in samma mediefrågor baserat på min-width
kan vi bara rikta in skärmen när den är större än en viss storlek, inte mindre.
Under denna omständighet passar inte folkgrafiken på små skärmar. Så vi använder en omvänd mediafråga för att ladda dem, så laddar vi dem på stora skärmar som de arbetar på, men laddar dem inte på små skärmar. Det är bättre än att ladda dem hela tiden och gömma dem på små skärmar.