Image sprites
Introduction
For the most part, you aren’t going to be using these because we have SVG now. But having the history of it – and examples will be important. And there are lots of interesting tricks you can do with them – so, here we go.
Making a simple sprite sheet
Here’s a sprite from the best video game ever.
Icon sprite sheets
If you had to send requests for hundreds of images on the first page load, that wouldn’t be very great! So: One image. One HTTP request. All the icons. It works. But, then you have to use the CSS background-position.
Sometimes… I think we just need an official CodePen module —
because yeah.
You have to go in – and change the width and stuff … (or at least I have been doing that – and it’s going to come back to haunt us. And really – should these even be CodePens? We could – use something else that was more embedded – and yeah… – something to think about.
Challenge: make the camera icon in the CodePen work.
Then – this could lead to more sprite-like option for icons and stuff