HTML DOM is a collection of JavaScript snippets to perform common tasks. No dependencies. HTML DOM →
HTML DOM – Common tasks of managing HTML DOM with vanilla JavaScript
Tag Archives: link
Create Diagonal Layouts with CSS Transforms
Layouts with diagonal sections are quite popular for several years now. It is not the new hot stuff, and you will probably not find it in the articles titled “Design trends for 2020”. But I think it is here to stay. It is one tool designers can use to bring some dynamic to all the …
Continue reading “Create Diagonal Layouts with CSS Transforms”
The CSS place-items shorthand
Great tip by Umar Hansa: CSS Tip 💡️The place-items property is shorthand for the align-items and justify-items properties. Here's an interactive demo of how it works: https://t.co/4unHqw5R3o — Umar Hansa (@umaar) April 7, 2020 To center children both vertically and horizontally, you only have to use these two declarations: element { display: grid; place-items: center; …
Schedule local notifications that don’t require a network connection with the Notifications API
As of Chrome 80, the Notifications API became available as an Origin Trial. The problem with the Push API is that it’s not reliable for triggering notifications which must be shown when a particular condition, like time or location, is met. Notification triggers solve this problem by letting you schedule notifications with their triggering condition …
New WebKit Features in Safari 13.1
This year’s spring releases of Safari 13.1 for macOS Catalina, iPadOS, iOS, and watchOS bring a tremendous number of WebKit improvements for the web across Apple’s platforms. All of this with many more updates for improved privacy, performance, and a host of new tools for web developers. These features stand out to me: Pointer and …
Bring the magic of Snapchat Lenses to your live streams and video chats with Snap Camera
Snap Camera is a desktop application by the Snapchat folks which allows you to apply their filters (“Lenses” as they call it) onto your webcam footage. The cool part is the fact that the app also exposes itself as a webcam to your system. That way you can use the (fake) Snap Camera as the …
The Beginner’s Guide to React
Speaking of Kent C. Dodds in the previous post: he has updated his The Beginner’s Guide to React on Egghead to include Hooks and the whole lot. This course is for React newbies and anyone looking to build a solid foundation. It’s designed to teach you everything you need to start building web applications in …
Methods for assigning an accessible name to a form control
Adrian Roselli: Too often folks will grab ARIA first to provide an accessible name for a thing. Or they may sprinkle hidden content around a form. In most cases the impact of those decisions is unknown. The assumption that they do the same thing, give the same output to all users, is wrong. In short, …
Continue reading “Methods for assigning an accessible name to a form control”
A sky map of the Hubble Space Telescope’s observations
Nadieh Bremer walks us through the visualization she made for Physics Today, celebrating the Hubble Space Telescope’s 30-year anniversary. A sky map of the Hubble Space Telescope’s observations →
Chrome Extension Webpack Boilerplate
If you ever want to create a Chrome Extension, this repo might come in handy: A basic foundation boilerplate for rich Chrome Extensions using Webpack to help you write modular and modern Javascript code, load CSS easily and automatic reload the browser on code changes. Chrome Extension Webpack Boilerplate →