A Firefox-only minimap (2021)

If you’re a Firefox desktop user, you might be curious about how the minimaps on my blog posts are created. Well, Firefox is the only browser that supports the fancy element() CSS function, which allows you to display images of HTML elements on your page. The best part is that it’s live, so you can see lazy-loaded images kicking in as you interact with the page. The CSS code to define another HTML element as a background image is pretty simple. And if you’re interested in Frontend news and emails, check out Web Weekly. Don’t forget to keep rocking and using Firefox!


To top