Welcome to Inside Geek, tips and tricks for professional designers and developers. The aim of this space is to (1) host solutions to niche/annoying digital problems. (2) explore ways to work more efficiently. (3) connect the geek in me, with the geek in you!

Randomly shuffle a Javascript array using the Fisher-Yates algorithm

Last updated on 16 March, 2023
Quickly shuffle a javascript array while maintaining an even probability of randomness among your results.
View Code

Create an animated CSS mask reveal with mask-image instead of embedding your content in a SVG

Last updated on 7 March, 2022
Creating an animated mask reveal isn't always as simple as it appears. Lots of techniques use SVG containers to achieve the effect. Here's an alternative method I developed recently that allows you to keep the DOM structure as standard as possible.
view post

Copy array data to the system clipboard with vanilla javascript

Last updated on 1 June, 2021
A simple technique for outputting array data as a list and then copying the list to the system clipboard.
View Snippet

Rapidly check through all links in an HTML email build with a little bit of help from vanilla javascript

Last updated on 21 August, 2020
Adding and checking the urls of large HTML email builds can be painful but it doesn't have to be. Let a few lines of Javascript make the process much less painful.
View Snippet

Fixing GSAP CDN issues for HTML5 banner builds served via Doubleclick Studio

Last updated on 19 August, 2020
Where to find the Doubleclick Studio CDN scripts for GSAP and how to resolve samesite cookie warnings in the console.

Free transform inverted in Photoshop 2019

Last updated on 24 June, 2019
Adobe has recently changed the way Photoshop's free transform scaling works! If you are not feeling it, here's how to change it back!
View Post

How to turn a non-retina monitor into a retina display for free

Last updated on 25 February, 2019
Need to test your designs on a Retina display? Did you know it's possible to get 'retina' resolutions on non-retina displays for free? Here are two ways to do it.

How to stagger line indentation with vanilla Javascript.

Last updated on 30 January, 2019
Imagine you need to create a template with dynamic text fields (editable by a non-developer), with line indentations that increase for each new line, to follow an offset background image. Here's one way to do it

How to fix bannertime CSS fontface getting stripped when you run gulp prod

Last updated on 30 January, 2019
Here's a quick fix to CSS @fontface declarations being stripped out when you run a gulp prod for Bannertime.
View Post

Preloading CSS background images with javascript

Last updated on 19 August, 2018
A vanilla JS script I wrote to preload background images and trigger a callback function once loaded into the DOM.
view post

Debugging click issues with javascript

Last updated on 16 July, 2018
This javascript snippet can help you to debug click issues quickly when clickthroughs are not firing as expected.
View Snippet

How to author and manage CSS like a pro

Last updated on 18 April, 2018
How can BEM, SASS and colour variable naming conventions make more manageable CSS for front end development?

DoubleClick Studio custom element for skins

Last updated on 9 April, 2018
How to use a custom studio element to serve a wallpaper/skin through a single, standard ad unit - with a standard HTML5 banner ad.
View post