Nickova ilustracija imala je tri različita sloja za glave. To su samo malo različite varijacije. Slike bismo mogli zamijeniti animacijom, JavaScriptom ili nečim sličnim, ali imati uvijek aktivnu animaciju (ili čak onu koja pokreće svako učitavanje stranice) vjerojatno bi bilo neugodno za teške korisnike foruma. Umjesto toga, napravit ćemo od njega uskršnje jaje, odnosno malu značajku koju možda nećete primijetiti ako slučajno slučajno ne naletite na nju.
Ono što ćemo učiniti je zamijeniti slike kad se prozor preglednika promijeni kroz @media upite. Umjesto samo nekoliko upita @media koji bi promijenili glave nekoliko puta, napravit ćemo mnoštvo upita @media koji ih mijenjaju svakih nekoliko piksela. U osnovi usmjeravajući duh Arleyja McBlaina "Lark Queries".
Sass petlju koristimo za stvaranje mnogih potrebnih @media upita. U konačnici:
@for $i from 25 through 125 ( @media (min-width: (($i+5)*15)+6+px) and (max-width: (($i+5)*15)+10+px) ( .forum-wrap ( background-image: url(… /wp-content/themes/CSS-Tricks-10/images/header-forums-2.png.webp); ) ) @media (min-width: (($i+5)*15)+11+px) and (max-width: (($i+5)*15)+15+px) ( .forum-wrap ( background-image: url(… /wp-content/themes/CSS-Tricks-10/images/header-forums-3.png.webp); ) ) )Ono što je lijepo u ovome je to što te dodatne slike ne učitavamo ako se stranici ne promijeni veličina pa ne učitavamo dodatne stvari samo za uskrsno jaje.