Learn basics of jQuery
Introduction to jQuery
jQuery provides an easy syntax for document navigation, and selecting, creating, and handling DOM elements, animations, and events. jQuery allows third-party plug-ins that create new abstractions for advanced effects and complex, themeable widgets. It is highly modular and enables powerful dynamic web pages and applications.
John Resig released the first version of jQuery at the 2006 BarCamp in NYC. It was influenced by cssQuery by Dean Edwards. A team led by Timmy Willison currently maintains jQuery, with Richard Gibson leading development on Sizzle, the jQuery selector engine.
The licensing history of jQuery is slightly complicated. It was first released under a Creative Commons license (CC BY-SA 2.5) but this was changed to the MIT license in 2006. At the end of the year, the GPL license was added as an option. To reduce confusion, the GPL was dropped in 2012.
The first stable release of jQuery, version 1.0, came out on August 26, 2006. Version 1.1 was released on January 14, 2007, and version 1.2 on September 10, 2007.
On January 14, 2009, version 1.3 added the Sizzle Selector Engine to the jQuery core. The size of the production version of this release was 55.9 KB. Version 1.4 followed on January 14, 2010.
On January 31, 2011, version 1.5 brought with it differed callback management, and a rewrite of the Ajax module.
Version 1.6 was released on May 3, 2011, with significant improvements to the attr() and val() functions.
The 1.7 release on November 3, 2001 came with new event APIs, specifically the on() and off() functions. This version still supported the old APIs, though.
By August 9, 2012, the 1.8 release had increased the file size of the production file to 91.4 KB. That version included a rewrite of the Sizzle selector engine, and improvements to animations and the flexibility of the $(html, props) syntax.
On January 15, 2013, the 1.9 release featured a removal of the old, deprecated interfaces and a general cleanup of the codebase. It was followed up with a 1.9.1 release on February 4, 2013.
The first 1.10.x release came on May 24, 2013, and included bug fixes and a change to the beta release cycle. The last release in the 1.10 series was 1.10.2 on July 3, 2013.
The 1.11 series came out on January 24, 2014 and ended with 1.11.3 on April 28, 2015. It had a size of 95.9 KB in the production release.
January 8, 2016 saw the start of the 1.12 series, which went on until the April 5, 2016 release of 1.12.3. It had a size of 95 KB in production.
The first 2.0 release came in April 18, 2013. It dropped support for Internet Explorer versions 6 through 8, which allowed performance improvement and a reduction to 81.1 KB in the final file size. The last 2.0.x release was 2.0.3 on July 3, 2013.
The 2.1 series was kicked off on January 24, 2014, and ended with 2.1.4 on April 28, 2015. It’s production file size creeped back up to 82.4 KB.
The story so far ends with the 2.2 series, kicked off on January 8, 2016, and ending with 2.2.3 on April 5, 2016. It’s file size again eased up to 83.6 KB.
- Slinky: is a gorgeous interactive menu. It provides a slick animation when the user pulls up a submenu. Visit the website for a demo.
- Twentytwenty: overlays multiple images with transparency. The user can transition between the images with a slider, and easily compare them for differences.
- Material design hierarchical display plugin: provides animated effects to guide a user to the next step in a process. The animations are fully customizable, and the plugin comes with fantastic documentation.
- Tabslet: is a simple way to create tabbed interfaces. It provides next and previous buttons, rotation, custom events, and deep linking. Take a look at the live demo on the website.
- Readable: manages the width of blocks of text for maximum readability. It solves the problem of paragraphs that are too wide or narrow to scan quickly. The website has a stunning demo on running copy.
- nanoGALLERY: is a simple, elegant image gallery. It features multi-level album navigation, lightboxes, thumbnail hover effects that can be mixed in different combinations, slideshows, a fullscreen mode, pagination, image lazy loading , themes, bootstrap compatibility, deep linking, i18n, and integration with Flickr, Picasa, and Google+ photo albums. It supports touch, is fast and responsive, and can use cloud storage.
- Tooltipster: is a contemporary spin on the venerable tool-tip. Tooltips can make full use of semantic HTML and CSS markup. It is thoroughly customizable.
- Magnific Popup: is a lightbox that is fast and compatible across many browsers, including high DPI devices like Apple’s Retina displays. It sacrifices features for a great user experience.
- Unslider: is an image slider plugin without the cruft and extra features. It is tiny and fast. Individual slides can use HTML markup, and are configurable with CSS. It has built-in support for keyboard shortcuts.
- Avgrund: is a modal popup window. It makes the rest of the page blur and appear to zoom out for extra pizzazz.
- jQuery Knob: converts input elements into touch-friendly dials that still work on the desktop. It is an interesting technical approach to tailoring existing content to new user interface paradigms.
- Typeahead.js: is a straightforward plugin that provides customizable autocomplete suggestions on your text forms.
- Scroll Path: lets you define custom motions for user interface elements when the user scrolls through your page. It uses Canvas syntax to specify paths and rotations.
- Lettering.js: provides detailed control over the kerning and coloring of individual characters. It combines will with FitText.
- FitText: scales text up and down to fit the container. It’s designed for responsive headlines, and integrates with Lettering.js.
jQuery Best Books
Scanning for the right programming book can be a test. Reading different books can help you gain a lot of information. This tends to cover the different levels of programming information and learning styles, which ideally will give you a better thought of which of the books you will discover to be most valuable. If you don’t like to read books, you can find tons of ruby tutorial online. Both books and tutorials will help you do jQuery coding easily!
We have listed books into three categories. The first level is for the beginners. The second level is for those who have had some experience with jQuery thus the category named Intermediate. The third category of books are for advanced users.
by Jon Duckett
by Mark Myers
You're going to get the hang of jQuery in less time than you might expect. And the knowledge will stick.
Why? Because this isn't just a book. It's a book plus 1,500 free interactive online exercises. It's the exercises that are going to turn you into a real jQuery coder.
Build websites with jQuery Mobile that work beautifully across a wide range of mobile devices
Become a competent jQuery Mobile developer and learn the building blocks of jQuery Mobile's component-driven design
This book covers key concepts but with a focus on providing the practical skills required
by Cody Lindley
by Cody Lindley
jQuery Enlightenment was written to express, in short-order, the concepts essential to intermediate and advanced jQuery development. Its purpose is to instill in you, the reader, practices that jQuery developers take as common knowledge. Each chapter contains concepts essential to becoming a seasoned jQuery developer.
by Leon Revill
Taking a recipe-based approach, this book presents numerous practical examples that you can use directly in your applications. The book covers the essential issues you will face while developing your web applications and gives you solutions to them. The recipes in this book are written in a manner that rapidly takes you from beginner to expert level.
by Brad Ediger
by Eric Sarrion
Are you looking for inspiration for your next front end project? Do you learn better by looking at examples than by reading books? Would you like to kill some time looking at cool web pages If you answered yes to any of those questions, take a look at these jQuery example projects. You might learn something new!
This is a full jQuery plugin that generates fully configurable grids for word games. Grid size and an optional timer are fully configurable. It can collect words from users, ensuring that words meet a configurable minimum length, are not duplicates, and do not re-use letters from the board multiple times.Explore this project!
Click on randomly generated bubbles as fast as you can to save the angel!
The jQuery is quite active and is very welcoming and supportive. Members will provide development advice and ideas for any part of your project. The jQuery team actively encourages people to get involved in the development of new version of jQuery.
- Using jQuery UI is the place to ask for help with the UI components, including Themeroller.
- Developing jQuery UI provides advice to developers adding to the UI library.
- jQuery Accessibility is a forum dedicated to creating disabled-accessible interfaces with jQuery.
- jQuery User Groups is a list of jQuery communities focused on specific geographic areas.
The official IRC support channel is #jquery on irc.freenode.net, while jQuery UI discussions happen on #jqueryui-dev. The website at irc.jquery.org has more information.
Here are some of the most important people who have contributed to the growth and development of jQuery. These people are the main reason that the jQuery community is as fun and enthusiastic as we find it today.
John Resig is the creator and lead developer for jQuery. He currently works as an application developer at Khan Academy. He was previously a tool developer for the Mozilla Corporation. His work on jQuery got him inducted into the Rochester Institute of Technology’s Innovation Hall of Fame.Visit Blog Twitter Profile
- Jörn Zaefferer is a freelance web developer and instructor. He lives in Cologne, Germany. From jQuery’s test suite, he created the QUnit testing framework. He maintains QUnit and several popular jQuery plugins. He is a development lead for jQuery UI, which means the creation of new plugins and widgets.
- Todd Parker is a principal at Filament Group Inc., a jQuery board member, project and design lead for jQuery Mobile, and design lead for jQuery UI. He is involved with ThemeRoller as well. He co-authored Designing With Progressive Enhancement and contributed to O’Reilly’s jQuery Cookbook. He presents regularly on mobile web, progressive enhancement, accessibility, and responsive design.
- Dave Methvin has long contributed to jQuery, and is active through the bug tracker and the discussion forums. He leads the jQuery dev team and ensures that releases are quality and on-schedule. He also organizes planning and development, and provides the vision for new versions of jQuery.
Visit Blog Twitter Profile