If you don't mind tech-related ads (not tracked), and want to keep us running, whitelist JSFiddle in your blocker.
Thank you! ❤️
One of those annoying CSS layout problems.
Updated demos for http://maketea.co.uk/2015/02/16/high-performance-touch-interactions.html
A mouse and touch draggable panel with support for calculating the velocity of a gesture.
A simple script using the haversine formula to calculate the distance between the current location and a specified point.
A simple function to calculate the difference between two ISO 8601 dates rounded to the nearest 30 seconds.
Quickly run a monkey test in your browser using gremlins.js
Share your disapproval of bad websites via their Google Analytics integration
This is a robust, performant image caption with an overlay that will slide up to reveal more content.
A CSS-only dropdown menu that is positioned horizontally central relative to its control without knowing the width of the content.
Jump or skip links provide a useful shortcut for users who do not use a mouse but they're usually hidden, even when focused...
A simple in-place image zoom.
A simple slideshow with before/current/after hooks for CSS transitions.
A very basic modal window implementation.
Visually replace form labels for text and select inputs without abusing HTML or usability.
Adds expandable content behaviour to the element with associated accessibility hints.
Adds dropdown behaviour to the element with associated accessibility hints.
Lazy and conditional image loading with a CSS placeholder and loading animation.
Adds tab content behaviour with associated ARIA roles and hints.
Simple, jQuery nestable click-to-open dropdown menu. Supports touch.
Tidy little CSS hover tooltips, no JS required.
A touch-enabled jQuery dropdown menu with hover intent for mouse events.
I used to always use this technique but I kind of like the native ones. Re-jigged and inspired for 2011 by http://jsfiddle.net/mnjKX/16/