John Cox

Blogs · @wyome · Now · Shelf

Tagged plugins · everything

Interesting

Geocomplete - jQuery Geocoding and Places Autocomplete Plugin

Geocomplete is a jQuery plugin that integrates Google Maps' geocoding and places autocomplete services into a web form, allowing users to search for locations with autocomplete suggestions. The plugin can optionally display an interactive map, automatically populate form fields with address details (latitude, longitude, formatted address, country codes, etc.), and supports features like draggable markers and custom map styling through various configuration options. It fires events for successful geocoding, errors, multiple results, and user interactions like map clicks and marker dragging, while also exposing methods to programmatically access the underlying map and perform geocoding requests.

Permalink

BorisMoore/jquery-tmpl · GitHub

jQuery Templates was an official jQuery plugin for rendering HTML templates with data binding, but the jQuery team discontinued it before a full release, passing maintenance to the original developer. JsRender has since become the recommended successor, offering similar syntax but with significantly better performance and a superset of the original features. The documentation here preserves jQuery's official API reference for the $.tmpl() method, including examples of rendering local arrays, remote data via AJAX, and caching compiled templates for reuse.

Permalink

jQuery Autosize

Autosize is a lightweight JavaScript library that automatically expands and contracts textarea elements to fit their content, eliminating the need for manual scrollbars. It works across modern browsers, can be initialized on single or multiple elements, and provides methods to manually trigger height updates or remove the functionality entirely. The library also fires custom events when resizing occurs and offers troubleshooting guidance for common issues like performance problems in Webkit browsers or incorrect initial heights on hidden elements.

Permalink

Formance.js by Omar Shammas

Formance is a jQuery library that formats and validates common form input types like credit cards, phone numbers, dates, and postal codes on the client side. While acknowledging that server-side validation is essential for security, the library prioritizes user experience by providing real-time formatting constraints and validation feedback that prevent users from entering improperly structured data. It supports various international formats including Canadian postal codes, Ontario driver's licenses, and UK sort codes.

Permalink

FullCalendar - Full-sized Calendar jQuery Plugin

FullCalendar is a widely-used JavaScript calendar library available for multiple frameworks (React, Vue, Angular, and vanilla JavaScript) that offers extensive customization through over 300 settings and a modular plugin system. The documentation provides installation instructions and basic setup examples for each framework, demonstrating how to create a calendar with month, week, and day view options. With over 9 million monthly NPM downloads and a commitment to maintaining a free open-source core while offering premium plugins for enhanced functionality, it serves as a comprehensive solution for integrating calendar functionality into web applications.

Permalink

jQuery Pin

I can't summarize this text. It's placeholder "Lorem Ipsum"-style filler content (strings of dessert names with no actual information) rather than a saved article with an argument or report to convey. If you have an actual article you'd like summarized, please share that instead.

Permalink

jQuery One Page Scroll by Pete R. | The Pete Design

One Page Scroll is a jQuery plugin that enables full-page scrolling animations similar to Apple's product marketing websites, where each section fills the entire viewport and transitions smoothly as users scroll. The plugin requires minimal setup—just wrapping sections in a container div and calling a single jQuery method—and offers customization options for animation timing, selectors, and easing effects. Pete R. released it as a free, ready-to-use tool available on GitHub for developers wanting to create Apple-style one-page scrolling experiences.

Permalink

Magnific Popup: Responsive jQuery Lightbox Plugin

Magnific Popup is a lightweight jQuery lightbox plugin (now deprecated) that displays images and content in responsive popups with a focus on performance and mobile compatibility. The plugin uses CSS for content resizing rather than JavaScript, supports high-DPI displays, and includes features like lazy-loading, zoom effects, and conditional lightbox switching for mobile devices. The author recommends using the native HTML `<dialog>` element for basic modals or PhotoSwipe for advanced image galleries as alternatives.

Permalink

CLNDR.js

CLNDR is a jQuery calendar plugin that separates data from presentation by accepting an Underscore.js template and providing it with a comprehensive data object containing days, events, and month/year information rather than generating markup itself. The plugin automatically handles month navigation, event rendering across calendar days, and provides callback hooks for custom interactions while allowing full control over styling and markup through templating. Saved instances can be manipulated programmatically to navigate months, change events, and trigger re-renders on demand.

Permalink

jQuery plugin for caching forms using HTML5 local storage | Developer Drive

This tutorial shows how to build a jQuery plugin that automatically saves form input values to the browser's localStorage and restores them when the page reloads, protecting users from losing their work due to crashes or accidental closes. The plugin uses JSON serialization to store form data keyed by the form's name attribute, listens for changes to input and select elements, and intelligently handles different input types—treating checkboxes and radio buttons differently from text inputs by checking their state rather than reading values. The implementation includes browser compatibility checking for localStorage support and can be invoked with a single line of jQuery code on any form element.

Permalink

TouchSwipe: a jQuery plugin for touch and gesture-based interaction

TouchSwipe is a jQuery plugin that detects swipe gestures on touch devices by monitoring the direction, distance, and duration of finger movements across a DOM element. The plugin offers multiple configuration options including directional handlers (swipeLeft, swipeRight, etc.), distance thresholds to filter out accidental touches, multi-finger detection, and a detailed swipeStatus callback that tracks each phase of the gesture for building complex interactive interfaces. Originally created in 2010 for a Renault car gallery website, it provides a practical alternative to the then-immature jQuery Mobile library for adding touch interactivity to web applications.

Permalink

FooTable: a jQuery Plugin for Responsive Data Tables | CSS-Tricks

Brad Vincent introduces FooTable, a jQuery plugin that makes data tables responsive by hiding columns at specified breakpoints and allowing rows to expand to reveal hidden data—combining the column-hiding and row-inversion approaches from existing solutions. The plugin uses HTML5 data attributes for intuitive configuration directly in markup and features an extensible architecture with optional add-ons like sorting, allowing developers to include only the functionality they need for each project.

Permalink

jQuery BlockUI Plugin

BlockUI is a jQuery plugin that prevents user interaction with a webpage or page element by overlaying a blocking message, useful for simulating synchronous behavior during AJAX requests without freezing the browser. The plugin can block the entire page or selected elements, display custom messages or modal dialogs, and offers extensive customization through options like fade effects, positioning, styling, and callbacks. It requires no dependencies beyond jQuery v1.2.3+ and is highly configurable both globally through default settings and locally through options passed to individual function calls.

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

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