How To Use the Widget Factory

To start, we'll create a progress bar that just lets us set the progress once. As we can see below, this is done by calling jQuery.widget() with two parameters: the name of the plugin to create, and an object literal containing functions to support our plugin. When our plugin gets called, it will create a … Continue reading

Writing Stateful Plugins with the jQuery UI Widget Factory

link Writing Stateful Plugins with the jQuery UI Widget FactoryWhile most existing jQuery plugins are stateless – that is, we call them on an element and that is the extent of our interaction with the plugin – there's a large set of functionality that doesn't fit into the basic plugin pattern. In order to fill … Continue reading

Extending Widgets with the Widget Factory

jQuery UI's widget factory makes it easy to build widgets that extend the functionality of existing widgets. Doing so allows you to build powerful widgets on top of an existing base, as well as make small tweaks to an existing widget's functionality. Note: This article assumes some basic knowledge of what the widget factory is … Continue reading

Widget Method Invocation

Widgets created with the widget factory use methods to change their state and perform actions after initialization. There are two ways widget methods can be invoked – through the plugin created by the widget factory, or by invoking the method on the element's instance object. link Plugin InvocationTo invoke a method using the widget's plugin, … Continue reading

Using jQuery UI with Bower

**Note:** This documentation refers to functionality made available in jQuery UI 1.11. Bower is a package manager for the Web. You can use Bower to download libraries like jQuery UI from the command line, without having to manually download each project from their respective sites. As an example, suppose we're starting a new project and … Continue reading

Using jQuery UI with AMD

**Note:** This documentation refers to functionality made available in jQuery UI 1.11. As of jQuery UI 1.11, all of the library's source files support using AMD. This means that you can manage your jQuery UI dependencies without using Download Builder, and load jQuery UI's source files asynchronously using an AMD loader such as RequireJS. In … Continue reading

The jQuery Object

When creating new elements (or selecting existing ones), jQuery returns the elements in a collection. Many developers new to jQuery assume that this collection is an array. It has a zero-indexed sequence of DOM elements, some familiar array functions, and a .length property, after all. Actually, the jQuery object is more complicated than that. link … Continue reading

Deferred examples

link Further Deferreds examplesDeferreds are used behind the hood in Ajax but it doesn't mean they can't also be used elsewhere. This section describes situations where deferreds will help abstract away asynchronous behavior and decouple our code. link Cachinglink Asynchronous cacheWhen it comes to asynchronous tasks, caching can be a bit demanding since you have … Continue reading

Introduction to Effects

link Showing and Hiding ContentjQuery can show or hide content instantaneously with .show() or .hide(): 1 2 3 4 5 // Instantaneously hide all paragraphs$( "p" ).hide(); // Instantaneously show all divs that have the hidden style class$( "div.hidden" ).show(); When jQuery hides an element, it sets its CSS display property to none. This means … Continue reading

Introducing Events

link IntroductionWeb pages are all about interaction. Users perform a countless number of actions such as moving their mice over the page, clicking on elements, and typing in textboxes — all of these are examples of events. In addition to these user events, there are a slew of others that occur, like when the page … Continue reading

Using the classes Option

As of the 1.12 release, the jQuery UI widget factory includes a means of managing CSS class names through the classes option. This article will give you an overview of how the classes option works, and discuss what you can do with it. link Syntax overviewThe classes option is used to map structural class names … Continue reading

Widget Factory

The jQuery UI Widget Factory is an extensible base on which all of jQuery UI's widgets are built. Using the widget factory to build a plugin provides conveniences for state management, as well as conventions for common tasks like exposing plugin methods and changing options after instantiation.

History of jQuery Events

Throughout the evolution of jQuery the means of event binding has changed for various reasons ranging from performance to semantics. As of jQuery v1.7 the .on() method is the accepted means of both directly binding events and creating delegated events. This article aims to explore the history of event delegation from jQuery v1.0 to the … Continue reading

Ajax

Traditionally webpages required reloading to update their content. For web-based email this meant that users had to manually reload their inbox to check and see if they had new mail. This had huge drawbacks: it was slow and it required user input. When the user reloaded their inbox, the server had to reconstruct the entire … Continue reading

Contributing

Depending on your level of experience with some of the workflows common to many open source projects, e.g. git/GitHub, the command line, and setting up a local development environment, contributing to this site may be a breeze or come with a bit of a learning curve. If you fit into the former group, great! Jump … Continue reading

Using jQuery UI ThemeRoller

link About ThemeRollerThemeRoller is a web app that offers a fun and intuitive interface for designing and downloading custom themes for jQuery UI. You can find ThemeRoller in the "Themes" section of the jQuery UI site, or by following this link: jQuery UI ThemeRoller link The ThemeRoller InterfaceThe interface for ThemeRoller is categorized into panels … Continue reading