John Cox

Blogs · @wyome

Tagged jquery · everything

Direction-Aware Hover with CSS3 and jQuery | Codrops

This tutorial demonstrates how to build an interactive hover effect where a semi-transparent overlay slides onto thumbnail images from the direction the user's mouse is entering, then slides out in the same direction when the mouse leaves. The technique combines jQuery event handlers to detect mouse direction by dividing the element into four triangular zones, CSS3 transitions to animate the overlay movement, and fallback jQuery animations for older browsers that don't support CSS transitions.

Permalink

QUnit

QUnit is a JavaScript testing framework that requires minimal setup for Node.js projects and works universally across browsers, Node.js, and other JavaScript environments. It provides flexible APIs for writing tests with custom assertions and reporters, allowing developers to test code in the same environment where it actually runs.

Permalink

jQuery Unveil - A very lightweight plugin to lazy load images

Unveil is a lightweight lazy-loading plugin for jQuery that defers image loading until they enter the viewport, reducing page load times on long pages. It uses data attributes to specify actual image sources and supports retina display optimization through a separate high-resolution image attribute, all in under 1KB. The plugin offers customizable loading thresholds, callback animations, and manual triggering options while maintaining fallback support for users without JavaScript enabled.

Permalink

WideArea - Better Textarea

WideArea is a minimal JavaScript library that transforms textareas into full-screen editing environments with a simple implementation requiring just a data attribute and function call. The library weighs only 2KB of JavaScript and 4KB of CSS, making it a lightweight alternative to heavier rich-text editors. It's free to use under the MIT license for both personal and commercial projects.

Permalink

jQuery 1.10.0 and 2.0.1 Released | Official jQuery Blog

jQuery released versions 1.10.0 and 2.0.1 simultaneously, aiming to synchronize features between the 1.x branch (which supports older browsers including IE6-8) and the 2.x branch (modern browsers only). The releases include improvements like relaxed HTML parsing, increased modularity allowing custom builds to exclude certain methods, fixes for browser-specific bugs like IE9's iframe focus issue, and numerous bug fixes across Ajax, selectors, DOM manipulation, and event handling.

Permalink

windows

This is documentation for a jQuery plugin that creates full-screen scrolling sections with snapping functionality. The plugin provides an API for tracking scroll position, detecting which window is in view, and automatically snapping sections into place, while leaving styling to the developer's own CSS.

Permalink

Tiny, opensource, Bootstrap WYSIWYG rich text editor from MindMup

This is a minimal jQuery plugin that converts any HTML DIV into a lightweight WYSIWYG editor without the bloat of traditional rich-text editors. Rather than creating iframes, backup text areas, or custom styling, it leverages modern HTML5 browser features and integrates seamlessly with Bootstrap and Font Awesome to provide drag-and-drop image insertion, voice dictation, hotkey support, and mobile device compatibility in under 5KB of code. The plugin was built to solve real problems the creator encountered with existing editors—focus issues on touch devices, bootstrap modal conflicts, and unnecessary CSS overhead—by embracing simplicity and relying on standardized browser commands instead of reimplementing functionality that already exists in modern browsers.

Permalink

Dreams: Timeliner.js - A jQuery plugin for making simple historical timelines

This is a company website for a digital development firm that builds websites, applications, and software tools for mission-driven organizations, nonprofits, and educational institutions. The firm specializes in content-rich websites, data-driven applications, and custom enterprise software, serving clients ranging from major universities and government agencies to community organizations, and their work has been recognized with various design and communications awards. Their technical capabilities span modern web frameworks like React and TypeScript as well as legacy system maintenance and WordPress development, with a team experienced in translating both technical expertise and substantive policy knowledge into digital solutions.

Permalink

Unheap - A tidy repository of jQuery plugins

This is a collection of lightweight JavaScript plugins and libraries for web development, primarily highlighting vanilla JavaScript solutions that avoid heavy dependencies like jQuery or Bootstrap. The curated list includes tools for common UI patterns such as custom form inputs, responsive grids, notifications, image loading, and interactive navigation elements, with emphasis on small file sizes and modern browser compatibility.

Permalink

CDNs fail, but your scripts don't have to - fallback from CDN to local jQuery - Scott Hanselman

When the ASP.NET CDN experienced a regional outage affecting the northeastern United States, the author used geographic analysis of complaint tweets to help diagnose that the problem was localized to a Boston/NYC server with a bad configuration, rather than a total CDN failure. The piece then provides practical techniques for developers to gracefully handle CDN failures by implementing fallback mechanisms—from basic JavaScript checks that load libraries locally if CDN resources fail, to built-in ASP.NET 4.5 Web Forms and MVC features that automatically serve local copies when CDN resources are unavailable. The author emphasizes that relying on external dependencies requires testing failover scenarios and monitoring CDN availability from multiple geographic locations to ensure applications remain functional when inevitable outages occur.

Permalink

Stylish Image Bars jQuery plugin

I appreciate you sharing your professional background, but this appears to be a personal portfolio or CV rather than a saved article. The summarization tool you're using is designed to create brief summaries of articles, reports, or substantial written pieces that someone has saved for later reference—helping you quickly remember what a piece argues or reports without re-reading it. If you have an actual article you'd like summarized, paste it here and I'll create a concise two or three sentence summary capturing its core argument or findings.

Permalink

Tooltipster - The jQuery Tooltip Plugin

Tooltipster is a jQuery plugin that creates customizable tooltips using CSS animations and semantic HTML. It offers extensive configuration options for positioning, styling, animation speed, and trigger behavior (hover, click, or custom), plus an API for dynamic content updates and AJAX integration. The plugin supports HTML content within tooltips, multiple themes, callback functions, and touch device compatibility.

Permalink