Links of the week 1/11/24
Interesting links I found this week.
Interesting links I found this week.
Interesting links I found this week.
I was working on a page with a link to a document fragment and put an animation on it using the :target
pseudo-class. Scrolling back to the anchor and pressing it again skips to the fragment, but the animation does not run again. That’s because it still has the pseudo-class, it doesn’t disappear when scrolling.
In my last post about screenshotting a node with JavaScript I got as far as a fairly low quality image. Since then I’ve figured out how to fix it.
One of my kids wanted a way to record their sports predictions and their notes app system was getting unwieldy, so I built a website for them. It’s on a Netlify subdomain with no search engine indexing as it’s a personal record, not a way to show off how good the predictions are, and they have no interest in monetising it. That means they’d rather not share pages with other fans, but screenshots. If it’s a big event with multiple predictions it extends beyond the viewport, so a regular OS screenshot won’t work.
Usually when I build a navigation it is at the end of the source and a skiplink appears at the top of small viewports linking to it. I then enhance it using CSS and JavaScript so that most devices and browsers get something nicer—an off-canvas interaction perhaps.
The for
loop is most commonly used for iterating over an array and performing an action on each item. For example:
More and more of the sites I’m building recently are using webfonts, and some of these fonts are very heavy. I care about load time and page weight, so I set about finding ways to ensure I could use webfonts while minimising some of the associated problems, viz. FOUT and missing content.
I’m building a thing that’s not quite finished yet, and it uses the geolocation API to get latitude and longitude. I wanted to put them into an object and use it for calculations.
AJAX has become a big part of responsive design for me. I use it to load secondary content into larger viewports to make it easier to find/view than if it is behind a small link in the footer or somewhere like that.