Dynamic Scroll Based Classes

Here is a super useful snippet for dynamically updating the body's class based on scroll position in the browser.
#javascript #css

How to build a responsive and lightweight image comparison slider

Many image comparison sliders are bloated and involve scroll/gesture-jacking, rendering it unusable on touchscreen devices. I would like to present you my own solution which is simple, compact, and transportable, using vanilla JavaScript and the range slider input field.
#javascript #images

Lazy loading is not a cure-all

This likely a pretty unpopular opinion, but this is also _my_ blog so I gotta be honest. In my recent perusal of the web, I've realised lazy loading is often redundant and unnecessary. In fact, I'll bet for the most part lazy loading is implemented just to satisfy Google, but it is also a feature many sites could do without.
#javascript #user experience

How to implement a fool-proof dark mode

**I think it's fair to say dark mode is one of 2019's biggest design patterns, especially amongst developers.** Here's a fool proof way to implement dark mode on your website so that it saves a user's preference and ensures no flash of inverting colours on page load.
#css #javascript

A rant about the State of CSS in 2019

I have opinions of the state of CSS today. Some of them controversial, probably.
#css #javascript #process #rant

Check if a device is a touchscreen

Sometimes it's useful to know if the device a user is visiting on is a touchscreen or not. This is because touchscreens don't generally render things like hover states.

My totally non-hacky ways to control the order in which JavaScript files are concatenated

If you're using a task runner like Gulp, Grunt, or even Codekit, you're probably minifying and concatenating your files. Processing javascript is a little more annoying in that the order they are processed matters. These are the ways I overcome this problem!
#javascript #build tools

Shorthand if/else statements in PHP & JS

#php #javascript