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 →

jQuery Mobile provides a set of touch-friendly UI widgets and an Ajax-powered navigation system to support animated page transitions. This guide will show you how you can build your first jQuery Mobile application. link Create a Basic Page TemplateTo get started, you can simply paste the template below in your favorite text editor, save, and … Continue reading →

link Theming OverviewjQuery Mobile has a robust theme framework that supports up to 26 sets of toolbar, content, and button colors, called a “swatch”. The framework comes with two defined themes A and B (light and dark) which can be used readily, removed, or overwritten. link Default Theme Swatch Mapping for ComponentsIf no theme swatch … Continue reading →

jQuery UI contains many widgets that maintain state and therefore may have a slightly different usage pattern than typical jQuery plugins you are already used to. While the initialization is the same as most jQuery plugins, jQuery UI’s widgets are built on top of the Widget Factory which provides the same general API to all … Continue reading →

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 →

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.

link Can I Use This Browser Feature?There are a couple of common ways to check whether or not a particular feature is supported by a user’s browser: Browser Detection Specific Feature Detection In general, we recommend specific feature detection. Let’s look at why. link Browser DetectionBrowser detection is a method where the browser’s User Agent … Continue reading →

jQuery makes it possible to animate arbitrary CSS properties via the .animate() method. The .animate() method lets you animate to a set value, or to a value relative to the current value. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 // Custom effects with .animate()$( “div.funtimes” ).animate( { … Continue reading →

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 →

link IntroductionEvent delegation allows us to attach a single event listener, to a parent element, that will fire for all descendants matching a selector, whether those descendants exist now or are added in the future. link ExampleFor the remainder of the lesson, we will reference the following HTML structure: 1 2 3 4 5 6 … Continue reading →