Avem antetul galeriei de bază, dar îi lipsesc micii oameni albastri pe care Erica i-a pus în ilustrația originală. Am vorbit despre asta în prealabil și am decis că ar fi destul de grozav dacă, atunci când ecranul va fi redimensionat, oamenii ar rămâne așezat pe măsură ce peretele galeriei se mișca în spatele lor, așa că se pare că navighează în galerie cu uimire.
Deoarece grafica pentru oameni este pur ornemantală, nu este ideală utilizarea marcajului pentru ele. Din fericire există două dintre ele și obținem două pseudoelemente gratuite pe fiecare element ( ::before
și ::after
). Le folosim pentru a le adăuga.
Introducem în acest videoclip un concept care va continua să fie util, conceptul de „interogări media reverso”. Lucrăm în mare măsură pe desktop în acest design, astfel încât interogările noastre media se bazează în principal pe max-width
. Dar dacă configurăm aceleași interogări media bazate pe min-width
, putem viza ecranul numai atunci când este mai mare decât o anumită dimensiune, nu mai mică.
În această circumstanță, grafica pentru oameni pur și simplu nu se potrivește pe ecrane mici. Așadar, folosim o interogare media reverso pentru a le încărca, astfel le vom încărca pe ecrane mari pe care funcționează, dar nu le încărcăm pe ecrane mici. Este mai bine decât să le încărcați tot timpul și să le ascundeți pe ecrane mici.